vue-router 和 vue-i18n 在router中实现国际化

今天遇到个需求，需要在router中实现国际化，试了半天发现router 和 i18n 是同级的，在router中调用this.$t()会报错，那么我们可以换种思路：在我的翻译文件中写好需要翻译的key，替换路由中的title，在用到title的地方使用i18n进行国际化，如下1) 在zh.js和en.js中分别写好key：2) 在router中的title位置进入该k...

君如墨

14472人浏览 · 2018-06-07 10:56:13

君如墨 · 2018-06-07 10:56:13 发布

今天遇到个需求，需要在router中实现国际化，试了半天发现 router 和 i18n 是同级的，在router中调用this.$t()会报错，那么我们可以换种思路：
在我的翻译文件中写好需要翻译的key，替换路由中的title，在用到title的地方使用i18n进行国际化，如下
1) 在zh.js 和 en.js中分别写好key：
这里写图片描述
2) 在router中的title位置进入该key

3) 在使用该路由title的地方使用i18n {{$t(item.name)}}进行国际化

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^