vue国际化

vue-i18n是一个vue插件,使用时需要在main.js中引用

import Vue from 'vue'

import App from './app.vue'

import store from './store'

import router from './router'

import i18n from '@crm/locales'

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

如此可以达到国际化的目的,但当与iview搭配使用,并需要在vue实例化之后替换文本时,我们需要新建一个文件用来存放各类语言的语言包(json格式),如在cn(中文)下新建common.json,在en(英文)下新建common.json,同时新建index.js用于导出这些语言json

在index.js中引入相应的iview语言包和本地语言包

import enUS from 'iview/src/locale/lang/zh-CN'

import zhCN from 'iview/src/locale/lang/en-US'

// 引入本地语言包

import cnCommon from './cn/common'

import enCommon from './en/common'

// 語言key

export const cnLang = 'zh-CN'

export const enLang = 'en-US'

export default { [enLang]:{ ...enUS, common: enCommon, }, [cnLang]:{ ...zhCN, common: cnCommon, }}

最后在main.js中相应引用

你可能感兴趣的:(vue国际化)