主要问题点在于 router 中无法用 this.$t('xxx.xx') 方法来进行翻译，会报错 this.$t is not a function 。而在main.js中可以试用，所以就做了一下处理：
main.js文件：
const i18n = new Vue18n({locale: lan,messages: {zh: require("./assets/i18n/zh"),en: require("./assets/i18n/en")},silentTranslationWarn: true
})router.beforeEach((to, from, next) => {if (to.meta.title) {document.title = `${i18n.t('meta.'+to.meta.title)} - ${i18n.t('meta.base')}`}next()
})
navbar.vue中点击切换语言：
changeLan(type) {this.$i18n.locale = type;document.title = `${i18n.t('meta.'+this.$route.meta.title)} - ${i18n.t('meta.base')}`}
en.js/zh.js配置：
module.exports = { meta:{base:'XXX',A:'XXX',B:'X',E:'XX'}
};
这样下来点击切换页面title也同时改变，爽歪歪，哈哈
当然目前代码有点冗余，两处改变document.title的方法都一样，提公用下,assets/js中新建title.js：
export function getPageTitle(i18n,key) {const hasKey = i18n.te(`meta.${key}`)const title = i18n.t(`meta.base`)if (hasKey) {const pageName = i18n.t(`meta.${key}`)return `${pageName} - ${title}`}return `${title}`
}
这个方法是参考 vue-element-admin i18n分支里的方法，比较完善一些。
分别在main.js和navbar.vue中引入：
import { getPageTitle } from './assets/js/title';
import { getPageTitle } from '../../assets/js/title';
main.js中：
const i18n = new Vue18n({locale: lan,messages: {zh: require("./assets/i18n/zh"),en: require("./assets/i18n/en")},silentTranslationWarn: true
})router.beforeEach((to, from, next) => {if (to.meta.title) {document.title = getPageTitle(i18n,to.meta.title)}next()
})
navbar.vue中：
changeLan(type) {this.$i18n.locale = type;document.title = getPageTitle(this.$i18n,this.$route.meta.title)}
然后OK。
另附上Vue i18n 官方API：
$te
参数：
{Path} key：必填{Locale} locale：可选
返回值：
boolean
检查 key 是否存在。在 Vue 实例中，如果未指定组件语言环境信息，则使用全局语言环境信息。如果指定了 locale，则使用 locale 的语言环境。