データメソッドでVue-i18nが正しく動作しませんか？次のように

Question

多言語フォルダi18n内容は以下のとおりです。

src lang cn.js us.js index.js

index.jsファイルの内容は次のとおりです。私が言いたい

import VueI18n from 'vue-i18n' 
import Vue from 'vue' 

Vue.use(VueI18n) 

const i18n = new VueI18n({ 
    locale: 'cn', 
    messages:{ 
     'cn': require('./lang/cn'), 
     'us': require('./lang/us') 
    } 
}) 

export default i18n; 

mina.js

import Vue from 'vue' 
import App from './App' 
import router from './router' 
import i18n from './i18n' //import mutil-lang 

Vue.config.productionTip = false 

var VueCookie = require('vue-cookie'); 
Vue.use(VueCookie); 

new Vue({ 
    el: '#app', 
    router, 
    template: '<App />', 
    i18n, //import mutil-lang 
    components: { App } 
}) 

テンプレートタグとJSコードへの書き込みは、次のようになります。

<template>  
    <div class="wrap"> 
     {{ $t('message.the_world') }} 
    </div> 
</template> 

と

export default { 
    name:'dkc-exchange-detail' , 
    data(){ 
     return { 
      showExchangeTypes: false, 
      exchangetItems: [ 
       //this.$t('message.the_world') Want to get the character of the corresponding language 
       {id: 1, text: this.$t('message.the_world')},// 
       {id: 2, text: this.$t('message.the_world_2')} 
      ],     
     } 
    }, 
} 

私は、多言語のメソッドを切り替える

：テンプレートで

methods:{   
    choiceLang: function(lang){ 
     if(lang === this.currentLang) 
      return; 
     this.currentLang = lang; 
     this.showLangSelecor = false; 
     this.$cookie.set('lang', this.currentLang.lang, { expires: 7 });   
     window.location.reload(); 
    }, 
}, 

は、マルチ言語の構文は、期待通りに動作しますが、JSの文法ではありません。それは特定の言語を表示するために注意を払う、問題はどこですか？ありがとう！

Answer 1

showLangSelectorのスペルが間違っています。また、reloadページが表示されると、全体のvueコンポーネントが破壊されて最初から再構築されるので、reloadより上のthis.foo = bar設定は機能しません。再ロードされたページでは、