source

가져오기가 있는 클래스를 확장합니다.

manycodes 2022. 11. 25. 20:53
반응형

가져오기가 있는 클래스를 확장합니다.

컴포넌트에 Import를 정의했습니다.다음으로 다른 컴포넌트가 연장되어 있습니다.어떻게 정의 및 액세스 할 수 있습니까?Service부모 컴포넌트가 Import한 것을 확인합니다.

서비스

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 컴포넌트로 만들어 확장하지 않는 것이 좋습니다.

감사해요.

데이터 속성에 할당할 수 있습니다.

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
    }
}

언급URL : https://stackoverflow.com/questions/46734626/vue-extend-a-class-that-has-an-import

반응형