切换lang

问题描述

我在nuxtjs上有一个站点,在那里我使用nuxt-i18n并具有两种语言设置,英语为认lang。 如果我设置第二种语言并刷新页面(f5),当我尝试将语言切换回认值时会出现问题。但是使用第二语言看起来不错。

enter image description here

控制台中有很多错误,例如

[vue-i18n] Value of key 'auth.logout' is not a string! vue-i18n.esm.js:33
[vue-i18n] Cannot translate the value of keypath 'auth.logout'. Use the value of keypath as default. vue-i18n.esm.js:33
[vue-i18n] Value of key 'appbar.sorting.label' is not a string! vue-i18n.esm.js:33
[vue-i18n] Cannot translate the value of keypath 'appbar.sorting.label'. Use the value of keypath as default. vue-i18n.esm.js:33
[vue-i18n] Value of key 'appbar.sorting.create_asc' is not a string! vue-i18n.esm.js:33
[vue-i18n] Cannot translate the value of keypath 'appbar.sorting.create_asc'. Use the value of keypath as default. vue-i18n.esm.js:33
[vue-i18n] Value of key 'appbar.sorting.create_desc' is not a string! vue-i18n.esm.js:33

另外,如果我使用认语言加载页面,然后切换到第二个语言,则一切正常。

对于切换语言,我使用一个组件。

<template>
  <v-row>
    <v-col cols="auto" id="language">
      <v-select
        v-model="current_language"
        dense
        :items="languages"
        item-value="code"
        item-text="name"
        max-width="10"
      >
        <template v-slot:selection="{ item }">
          <v-img :src="item.flag" max-height="32" max-width="32"></v-img>
          <span class="ml-3">{{ item.name }}</span>
        </template>
        <template v-slot:item="{ item }">
          <v-img :src="item.flag" max-height="32" max-width="32"></v-img>
          <span class="ml-3">{{ item.name }}</span>
        </template>
      </v-select>
    </v-col>
  </v-row>
</template>

<script>
export default {
  props: ["instant"],data() {
    return {
      current_language: this.$i18n.locale,languages: [
        {
          name: "English",code: "en",flag: "/img/usa-flag.png"
        },{
          name: "Russian",code: "ru",flag: "/img/russia-flag.png"
        }
      ]
    };
  },watch: {
    current_language(val) {
      if (typeof this.instant != "undefined") {
        this.$router.push({ path: this.switchLocalePath(val) });
      }
    }
  },methods: {
    save() {
      this.$router.push({ path: this.switchLocalePath(this.current_language) });
    }
  }
};
</script>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)