// 下载vue-i18n依赖,"vue-i18n": "^6.1.3" npm install vue-i18n@6 // 创建文件vueIN.js import Vue from 'vue'; import VueI18n from 'vue-i18n'; Vue.use(VueI18n); // 引入各个语言配置文件 import zh from './zh'; import en from './en'; // 创建vue-i18n实例i18n const i18n = new VueI18n({ // 设置默认语言 locale: 'zh', // 语言标识 // 添加多语言(每一个语言标示对应一个语言文件) messages: { zh, en, } }) // 暴露i18n export default i18n; // main.js文件 import i18n from './util/vueIN' new Vue({ router, store, i18n,// 挂载 render: h => h(App) }).$mount('#app') // 创建文件zh.js const zh = { admin: '后台管理系统', test: '你好', language: { zh: '中文', en: 'English', }, } export default zh; // 创建文件en.js const en = { admin: 'admin', test: 'hello', language: { zh: '中文', en: 'English', }, } export default en; // 页面使用 <div>{{$t("admin")}}</div> <input :placeholder="$t('test')"> <button @click="btn('zh')">中</button> <button @click="btn('en')">英</button> btn(type){ // 切换语言 this.$i18n.locale=type console.log(this.$t("language.zh")) },