Vue+i18n配置,取不到该语言取默认语言(备选语言)

安装vue-i18n模块

npm install vue-i18n

我的配置(包含备选语言)

import VueI18n from 'vue-i18n'
import elementEnLocale from 'element-ui/lib/locale/lang/en' // element-ui 的语言
import elementZhLocale from 'element-ui/lib/locale/lang/zh-CN'// element-ui 的语言
import enLocale from './en'
import zhLocale from './zh'
Vue.use(VueI18n)
const messages = {
  en: {
    ...enLocale,
    ...elementEnLocale
  },
  zh: {
    ...zhLocale,
    ...elementZhLocale
  }
}

let localStorageLang = localStorage.getItem('lang')
let lang = ''
if(localStorageLang === '1'){
  lang = 'zh'
}else if(localStorageLang === '2'){
  lang = 'en'
}
const i18n = new VueI18n({
  locale: lang, // 语言标识
  fallbackLocale: 'en',//现在我们市10国语言,中文一定有,英文也是(所以其他语言)
  messages // set locale messages
})
// console.log(i18n)
Vue.use(ELEMENT, {
  i18n: (key, value) => i18n.t(key, value)
})
export default i18n

html上使用

<span v-text="$t('index.day')">天</span>
<span>{{$t('index.day')}}</span>

js上使用

export default {
    data(){
      day:this.$t('index.day'),
      day2:天,
      day3:'',
      num:3,
    },
    mounted(){
       this.day2 = this.$t('index.day')
       this.day3 = this.$t('index.day2')
      //第3天
      this.$t('index.day3')+this.num+this.$t('index.day1')
      this.$t('index.day4',{name:this.num})
    }
}

zh.js

  index:{
    day:'天',
    day2:'天',
    day3:'第',
    day4:'第{{name}}天',
  }