반응형
vue i18n - javascript 오브젝트로 사용(템플릿 내가 아님)
vue, vue-i18n을 javascript(개체로서)만으로 사용할 수 있고 템플릿에서는 사용할 수 없습니까?
window.confirm 같은 곳에서 사용하고 싶은데 가능한가요?
고마워요.
네, 가능합니다. 저는 플러그인을 사용한 적이 없습니다만, 매우 간단해 보입니다.
먼저 인스턴스를 만듭니다.
// Ready translated locale messages
const messages = {
en: {
message: {
greeting: 'hi {name}'
}
},
es: {
message: {
greeting: 'hola {name}'
}
}
}
// Create VueI18n instance with options
const i18n = new VueI18n({
locale: 'es', // set locale
messages, // set locale messages
})
('const'는 es6임을 유의하십시오.)
그런 다음 i18n var가 존재하는 임의의 js에서 사용할 수 있습니다.
i18n.t('greeting', { name: 'kazupon' }) // -> hola kazupon
문서:
http://kazupon.github.io/vue-i18n/en/started.html
http://kazupon.github.io/vue-i18n/en/migrations.html
버전 6.x 이후의 컴포넌트 내부 사용:
mounted() {
this.$i18n.t('path', 'en', { foo: 'bar' })
}
아니면
mounted() {
this.$t('path', 'en', { foo: 'bar' })
}
버전 5.x의 경우:
mounted() {
Vue.t('path', 'en', { foo: 'bar' })
}
출처 : https://github.com/kazupon/vue-i18n/issues/149#issuecomment-300096155
예, 18n 값을 가져올 필요가 있는 i18n.js 구성 파일을 Import합니다(i18n With Vue.js 프로젝트를 구성한 위치).
import i18n from '@/plugins/i18n'
@를 사용하여 루트로부터의 경로를 가져옵니다.
그리고나서
값을 부가하다
i18n.t('salesOrder'),
언급URL : https://stackoverflow.com/questions/43448071/vue-i18n-using-it-as-a-javascript-object-not-inside-the-template
반응형
'programing' 카테고리의 다른 글
대규모 SPA에서 우수한 VueX 스토어 디자인을 사용하는 방법 (0) | 2022.08.27 |
---|---|
vuejs 프로젝트를 heroku에 전개하는 방법 (0) | 2022.08.27 |
Java 런타임 퍼포먼스와 네이티브 C/C++ 코드 비교 (0) | 2022.08.27 |
Java에서 플로트를 int로 변환하는 방법 (0) | 2022.08.27 |
상위 컴포넌트의 소품 접근 방법 확인 - 포장지가 아닌 수입업체 (0) | 2022.08.27 |