Я установил библиотеку vue-i18n (http://kazupon.github.io/vue-i18n/en/) для локализации в проекте VueJS.
Так что я сейчас пытаюсь использовать ее и при переключении между языками обновлять данные.Вот как я пытался его использовать:
Пример 1:
<template>
<h1>{{ $t('message.hello') }}</h1>
</template>
Пример 2:
<template>
<h1>{{ msg }}</h1>
</template>
Где выглядит код из компонента:
<script>
export default {
data() {
return {
msg: this.localeTest //which is showing undefined all the time
//here I also tried the "msg: this.$t('message.hello')" and
//in this case the value of the inital language is displayed
//but then it's never updated while switching languages
};
},
computed: {
localeTest() {
return this.$t('message.hello');
}
},
methods: {
changeLocale() {
if (this.$i18n.locale === 'ja-JP') {
this.$i18n.locale = 'en-US';
} else {
this.$i18n.locale = 'ja-JP';
}
}
}
};
</script>
Пример 1 работает, как и ожидалось, но мне интересен пример 2. Для этого я попробовал два сценария (которые описаны в комментариях в коде), но ни один из них не работает должным образом.Мне больше интересно заставить его работать по сценарию «вычисляемое свойство».