반응형
Vue-i18n Single File Component 구문과 루트 메시지 결합
Vue용 뛰어난 vue-i18n 플러그인을 시험하고 있습니다.번역을 필요로 하는 템플릿에 직접 삽입할 수 있는 깔끔한 기능을 갖추고 있습니다.단, 사용 시 루트 변환 노드에 액세스할 수 없습니다.이 모델은 지원 대상입니까?아니면 제가 잘못하고 있는 건가요?
main.discloss.main.discloss.
import VueI18n from 'vue-i18n';
Vue.use(VueI18n);
const i18n = new VueI18n({
locale: 'en',
messages: {
en: {
'company-name': 'billy-bob\'s fine steaks.'
}
}
});
Sample.vue
<i18n>
{
"en": {
"title": "@:company-name - yeee hawwww!!!"
}
}
</i18n>
<template>
<div id="app" class="container">
<site-header :title="$t('title')"></site-header>
</div>
</template>
i18n 정의는 컴포넌트 내에서 부모 i18n 정의와 자녀 i18n 정의 모두에 액세스할 수 있도록 결합되어 있습니다.자녀 정의는 오버랩이 있는 부모 i18n 정의보다 우선합니다(예를 들어 i18n 정의가 있는 경우).title
부모 키와 자식 키, 자식 키가 사용됩니다.)
그러나 사용하고 있는 구문은 확실히 기능하지 않습니다.이 경우 변환된 두 값을 조합한 계산을 정의하여 사용할 수 있습니다.
computed:{
title(){
return this.$t("company-name") + this.$t("title")
}
}
그런 다음 템플릿에서 계산된 값을 사용합니다.
<template>
<div id="app" class="container">
<site-header :title="title"></site-header>
</div>
</template>
언급URL : https://stackoverflow.com/questions/44446205/combining-vue-i18n-single-file-component-syntax-with-root-messages
반응형
'programing' 카테고리의 다른 글
Gson 라이브러리를 사용하여 JSON 문자열을 어떻게 변환합니까? (0) | 2022.08.27 |
---|---|
vue 데이터 값을 글로벌 스토어 상태 값과 동기화하는 방법이 있습니까? (0) | 2022.08.27 |
HttpClient 로깅 사용 안 함 (0) | 2022.08.27 |
어려운 컴포넌트 1개에 대해 로컬 vuex를 생성할 수 있습니까? (0) | 2022.08.27 |
Java에서 Map 값을 증가시키는 가장 효율적인 방법 (0) | 2022.08.27 |