Typescript/Vue - Prop의 기본 개체를 선언할 때 vuex 저장소에 액세스하려면 어떻게 해야 합니까?

Typescript/Vue - Prop의 기본 개체를 선언할 때 vuex 저장소에 액세스하려면 어떻게 해야 합니까?

Vue-Typescript 프로젝트에서 "data"라는 이름의 프롭을 선언했으며, 이 프롭에 대해서도 객체 구조를 기본값으로 정의하기를 원합니다.일부 필드는 다국어이므로 사용자가 활성화한 모든 활성 언어를 반환하는 vuex 저장소에 액세스해야 합니다.이를 통해 필드를 동적으로 생성할 수 있습니다.제가 어떻게 이 일을 해낼 수 있는지 아는 사람 있나요?

export default class CompanyForm extends Vue {

    public dialog = false;

    @Prop({default: {
        name: '',
        address: this.$store.state.Language.data.getLanguageDataStructure(),
        telephone: '',
        fax: '',
        email: '',
        website: ''
    }})
    data: object;
});

유일한 옵션은 스토어를 수동으로 가져와서 대신 사용하는 것입니다.this.$store프롭의 기본값이 계산될 때 구성요소가 아직 인스턴스화되지 않기 때문입니다.

구성 요소 인스턴스가 생성되기 전에 속성의 유효성이 검사되므로 기본 또는 검증자 함수 내에서 인스턴스 속성(예: 데이터, 계산 등)을 사용할 수 없습니다.

(경고를 보려면 Vue Properties를 참조하십시오.)

기본값이 개체 또는 배열인 경우에도 함수를 기본값으로 사용해야 합니다. 그렇지 않으면 모든 인스턴스가 동일한 기본값을 공유하기 때문입니다.(Vue Prop 검증, 참조)propE예)

다음과 같은 방법이 사용될 것입니다.

import store from 'path/to/your/store';

export default class CompanyForm extends Vue {

    public dialog = false;

    @Prop({default: () => ({
        name: '',
        address: store.state.Language.data.getLanguageDataStructure(),
        telephone: '',
        fax: '',
        email: '',
        website: ''
    })})
    data: object;
});

언급URL : https://stackoverflow.com/questions/57100709/typescript-vue-how-can-i-get-access-to-the-vuex-store-when-im-declaring-a-def