vue-i18n学习中遇到的坑

学习vue-i8n,遇到了一些自己疏忽的问题。总结一下

1. 首先要在vue项目中使用，
2. yarn add vue-i18n
3. yarn add element-ui （注释：之后点击时候的弹窗是基于这个插件来做的）

文件目录

en.js中的代码

module.exports = {
  message: {
    title: 'Sport Brands'
  },
  placeholder: {
    enter: 'Please type in your favorite brand'
  },
  brands: {
    nike: 'Nike',
    adi: 'Adidas',
    nb: 'New Banlance',
    ln: 'LI Ning'
  }
};

zh.js中的代码

// 注意：一定是 exports，不是 export，否则会报错，报错信息是下列的中的内容不是 string
module.exports = {
  message: {
    title: '运动品牌'
  },
  placeholder: {
    enter: '请输入您喜欢的品牌'
  },
  brands: {
    nike: '耐克',
    adi: '阿迪达斯',
    nb: '新百伦',
    ln: '李宁'
  }
};

index.js

import messagesEn from './en'
import messagesZh from './zh'

const messages = {
  en: {
    message: messagesEn
  },
  zh: {
    message: messagesZh
  }
};

export default messages

cookie.js

function getCookie(name,defaultValue) {
  var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
  if (arr = document.cookie.match(reg))
    return unescape(arr[2]);
  else
    return defaultValue;
};

export default  getCookie

main.js

import Vue from 'vue'

import App from './App'
import router from './router'
import VueI18n from 'vue-i18n'
Vue.use(VueI18n);
import getCookie from './cookie/cookie'
const i18n = new VueI18n({
    locale: getCookie('PLAY_LANG','en'),// 语言标识
    messages: {