使用插件：vue-i18n

1.npm安装

npm install vue-i18n

2.main.js文件中配置

import Vue from 'vue';
import VueI18n from 'vue-i18n';
Vue.use(VueI18n);

创建带有选项的 VueI18n 实例

const i18n = new VueI18n({
    locale: localStorage.getItem("locale") || "zh-cn", // 语言表示，通过切换local来切换本地语言
    messages: {   
    'zh-cn': require('@/assets/lang/zh-CN.js'),   
    'en-us': require('@/assets/lang/en-US.js') 
  }
window.i18n = i18n;

把 i18n 挂载到 vue 根实例上

new Vue({
    i18n,
    router,
    store,
    render: h => h(App),
}).$mount("#app");

3.语言包

中文语言包：zh-CN.js

export default {
    common: {
        name: "名称",
        new: "新增",
        modify: "修改",
        delete: "删除",
     },
     login: {
        userName: "用户名",
        password: "密码",
     },  

英文语言包：en-US.js

export default {
	common: {
        name: "Name",
        new: "New",
        modify: "Modify",
        delete: "Delete",
	}
	login: {
       userName: "userName",
       password: "password",
	},
}

4.模板渲染
vue文件中使用

 <div>{{ $t("common.name") }}</div>
 <a-modal :title="login.userName"></a-modal>

store文件中使用

window.i18n.t("common.name")