vue i18n 设置保存到 Cookies

安装js-cookie

yarn add js-cookie --save

引起

import Cookies from 'js-cookie'

在i18n文件中设置

import Vue from 'vue'
import VueI18n from 'vue-i18n'
import * as locale from './locales'
import Cookies from 'js-cookie'

Vue.use(VueI18n)

export default new VueI18n({
  locale: Cookies.get('language') || 'en',
  messages: {
    'en' : locale.enUS,
    'zh' : locale.zhCH, 
  }, 
})

组件中使用

<template>
  <b-navbar>
    <b-navbar-nav class="ml-auto">
      <b-nav-item-dropdown :text="$t('message.lang')" right>
        <b-dropdown-item v-for="(lang, i) in langs" :key="lang.index" @click="setLocalLanguage(lang)">{{ lang }}</b-dropdown-item>
      </b-nav-item-dropdown>
    </b-navbar-nav>
  </b-navbar>
</template>
<script>
import Cookies from 'js-cookie'
export default { 
  data() {
    return {
      langs : ['en', 'zh'],
    }
  },
  methods:{ 
    setLocalLanguage(lang) {
        this.$i18n.locale = lang
        Cookies.set('language', lang)
    }
  },

}
</script>