第一步:
先安装依赖啦
npm install vue-i18n -save
安装完接着就在main.js中引入 // 语言包
- 省略其他...
import i18n from '@/lang'
2 加入到根实例配置项中
new Vue({
el: '#app',
router,
store,
i18n,
render: h => h(App)
})
3.进行配置
import VueI18n from 'vue-i18n'
Vue.use(VueI18n) // 通过插件的形式挂载
const i18n = new VueI18n({
locale: 'zh-CN', // 语言标识
//this.$i18n.locale // 通过切换locale的值来实现语言切换
messages: {
'zh-CN': require('./common/lang/cn'), // 中文语言包
'en-US': require('./common/lang/en') // 英文语言包
}
})
如果需要别的语言,自己将语言包放入 ,并且引入即可
locale是设置当前语言的,后期需要切换时使用this.$i18n.locale=xx即可切换
require就是引入的语言包。这个需要自己配置,暂时没有办法自动搞。
找到路径新建js后,这就大功告成了。
使用时注意:html中 例如 `span等标签内包裹的内容 {{ $t ('navbar.companyName') }}
js中 例如 methods方法中 this.$t('navbar.xxxx')
对照文件en / zh 文件一一对照跟改 , 都是"体力活"