VUE(2)$t 是啥?
详见:https://blog.csdn.net/Dream_xun/article/details/82743762在组件里使用 {{ $t ("xxx") }}<el-button class="filter-item" size="small" type="primary" v-waves @click="searchList">...
·
详见:前端框架Vue——vue-i18n ,vue项目中如何实现国际化,$t的用法_Dream_xun的专栏-CSDN博客_this.$t()
国际化 i18n 方案,$t 是 vue-i18n 提供的全局方法,
在组件里使用 {{ $t ("xxx") }} ,可以看到 search 译为 查询
<el-button class="filter-item" size="small" type="primary" v-waves @click="searchList">
{{$t("btn.search")}}
</el-button>
xxx的来源:目录树—— scr / i18n / zh.js / zh
const zh = {
btn: {
search: '查询',
}
}
配置了英文和中文两种语言,上文链接中的示例:
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/zh'), // 中文语言包
'en-US': require('./common/lang/en') // 英文语言包
}
})
/* eslint-disable no-new */
new Vue({
el: '#app',
i18n, // 不要忘记
store,
router,
template: '<App/>',
components: { App }
})
更多推荐
已为社区贡献1条内容
所有评论(0)