1. 下载vue-i18n
npm i vue-i18n
2. 修改main.js
import VueI18n from 'vue-i18n'
import enLocale from 'element-ui/lib/locale/lang/en'
import zhLocale from 'element-ui/lib/locale/lang/zh-CN'
import customEnLocal from '@/i18n/lang/en'
import customZhLocal from '@/i18n/lang/zh-CN'
Vue.use(VueI18n)
const messages = {
en: {
...enLocale,
...customEnLocal,
},
zh: {
...zhLocale,
...customZhLocal,
},
}
const i18n = new VueI18n({
locale: 'zh', // set locale
messages, // set locale messages
})
Vue.use(ElementUI, {
i18n: (key, value) => i18n.t(key, value),
})
new Vue({
i18n, // new Vue中加入i18n
router,
store,
render: h => h(App)
}).$mount('#app')
export { i18n }
3. 创建中英文转化文件
en.js
export default {
base: {
button: {
query: 'Query',
},
},
}
zh-CN.js
export default {
base: {
button: {
query: '查询',
},
},
}