main.js
import vue from 'vue'
import app from './app'
import router from './router'
import vuei18n from 'vue-i18n'
import elementui from 'element-ui';
vue.use(elementui);
vue.use(vuei18n)
const i18n = new vuei18n({
locale: 'zh-cn', // 语言标识
//this.$i18n.locale // 通过切换locale的值来实现语言切换
messages: {
'en-us': require('./assets/languages/en'), // 英文语言包
'zh-cn': require('./assets/languages/zh-cn'), // 中文语言包
}
})
console.log(i18n.locale)
/* eslint-disable no-new */
new vue({
el: '#app',
router,
i18n,
components: { app },
template: '
})
app.vue文件
<script>
import appfooter from "@/components/app-footer"
export default {
name: 'app',
data() {
return {
}
},
components: {
appfooter
},
methods: {
},
mounted() {
}
}
</script>
文件
点我
{{$t('m.music')}}
<script>
export default {
name: "app",
data() {
return {
lang: "zh-cn"
}
},
methods: {
/**
* 切换语言
*/
changelangevent() {
this.$confirm('确定切换语言吗', '提示', {
confirmbuttontext: '确定',
cancelbuttontext: '取消',
type: 'warning'
}).then(() => {
console.log(this.lang)
if (this.lang === 'zh-cn') {
this.lang = 'en-us';
this.$i18n.locale = this.lang;//关键语句
} else {
this.lang = 'zh-cn';
this.$i18n.locale = this.lang;//关键语句
}
}).catch(() => {
this.$message({
type: 'info',
});
});
}
}
}
</script>
语言包
export const m = {
music: '网易云音乐',
findmusic: '发现音乐',
mymusic: '我的音乐',
friend: '朋友',
musician: '音乐人',
download: '下载客户端'
}
export const m = {
music: 'music',//网易云音乐
findmusic: 'find music',//发现音乐
mymusic: 'my music',//我的音乐
friend: 'friend',//朋友
musician: 'musician',//音乐人
download: 'download'//下载客户端
}
如对本文有疑问， 点击进行留言回复！！
我要评论
网友评论