一、Uniapp国际化方案
在多语言需求的场景下,Uniapp推出了国际化方案。在多语言需求中,可以为不同的语言提供相应的翻译,便于用户更好地了解应用的功能。下面来看一下Uniapp的国际化方案。
//main.js
import VueI18n from 'vue-i18n'
import zh from '@/locale/lang/zh-CN' //引入中文
import en from '@/locale/lang/en-US' //引入英文
import cnmsg from '@/locale/lang/cnmsg.json' //引入中文语言包
import enmsg from '@/locale/lang/enmsg.json' //引入英文语言包
Vue.use(VueI18n);
const locale = uni.getStorageSync('locale') || 'zh_CN';
const i18n = new VueI18n({
locale,
messages: {
'zh_CN': Object.assign(zh, cnmsg),
'en_US': Object.assign(en, enmsg),
}
});
export default i18n;
在上述代码中,我们已经可以看到国际化的核心文件Vue-i18n以及引入的中英文语言包。通过用户设置获取所需语言包。
二、Uniapp国际化Tabbar无效
在Uniapp国际化方案中,我们有时会发现Tabbar组件的国际化无效。原因是Tabbar是在APP.vue中定义和切换。我们需要在每个子页面中重新定义Tabbar组件来解决这个问题。
//app.vue
原创文章,作者:小蓝,如若转载,请注明出处:https://www.506064.com/n/192639.html