Vue擴展了一個具有導入的類

Question

我已經在組件上定義了導入。然後我有另一個組件延伸出來。我將如何去定義和訪問父組件導入的Service？

服務

export default { 
    getSomeData() { 
     return [1,2,3,4] 
    } 
} 

父組件

import Service from '../service'; 

export default { 
    data() { 
     return { 
      testData: 'test' 
     } 
    } 
} 

輔元件

import Component from '../component'; 

export default { 
    extends: Component, 

    mounted() { 
     console.log(Service.getSomeData()); // [1,2,3,4] Doesn't work, Service not defined. 
     console.log(this.testData); // 'test' Works 
    } 
} 

一般來說，我只想導入Service的子組件，並使用該功能。如何在父級中定義它，以便我可以在孩子中訪問它，而無需再爲其他孩子導入它？我寧願不把它變成一個Vue組件並擴展它。

感謝

Answer 1

你可以把它分配給一個數據屬性：

import Service from '../service'; 

export default { 
    data() { 
     return { 
      testData: 'test', 
      service: Service 
     } 
    } 
} 

import Component from '../component'; 

export default { 
    extends: Component, 

    mounted() { 
     console.log(this.service.getSomeData()); // [1,2,3,4] 
     console.log(this.testData); // 'test' Works 
    } 
}