Vuex 스토어에서 i18n-nuxt $t 사용

Vuex 스토어에서 i18n-nuxt $t 사용

내 문제는 좀 구체적이다.나는 이 프로젝트에 Vuex와 Nuxt를 사용하고 있다.의존성을 위해 i18n-nnuxt를 사용하지만, 구성 요소에서 잘 작동하는 동안 $t('some.translation')를 $store에서 사용할 수 없다.나는 상상할 수 있는 모든 조합을 시도했지만 여전히 결과는 나를 같은 오류로 이끈다.

ReferenceError $t is not defined또는Cannot read the property of i18n

그래서 이 경우에 나는 이 문제를 해결하기 위해 도움을 좀 쓸 수도 있고, 누군가 i18n을 필터로 사용하는 방법을 알려준다면 완벽할 것이다.(어느 길밖에 없다고 생각하나)

예를 들어 이 코드 블록은 $store.state에서 가져온 것이다.

  sortMethods: [
{ id: 'airline', name: this.i18n.$t('Airline'), asc: 'A', desc: 'Z', defaultDirection: 'asc' },

당신은 내가 그들이 있는 곳을 번역할 수 없다는 것을 상상할 수 있을 것이다.

사용할 수 있음t와의 돌연변이와 행동으로.this.$i18n.t. ex.

export const mutations = {
  foo() {
    console.log(this.$i18n.t("bar"));
  }
}

그러나 나는 주나 게이터들이 접근할 수 없기 때문에 그것을 사용할 방법을 찾지 못했다.this.

i18n 모듈은 기본적으로 스토어 컨텍스트에 주입되지 않으며, "이" 키워드도 모듈에 액세스할 수 없다.

번역 파일의 키를 저장소의 값으로 저장하거나 심지어 개체의 ID를 같은 변환 키로 사용한 다음 구성 요소에서 $t 함수를 사용하여 변환하는 것이 더 나은 방법이 아닌가?

다음과 같이

store.js.

const state = {
   sortMethods: [
        {
           id: “airline”, 
           key_name: “airline”
        }
   ]
}

그런 다음 구성 요소에서 선택 태그.vue:

<option v-for=“method in $store.state.sortMethods” :key=“method.id”> {{$t(method.key_name)}}</option>

이것은 상점에서 번역된 목록을 너에게 줄 것이다.직접 번역할 필요는 없다.

랑그 파일에 번역 키가 항상 같다는 아이디, 키, 이름까지도 사용할 수 있다.

참조URL: https://stackoverflow.com/questions/65488981/using-i18n-nuxt-t-in-vuex-store