一、安装
npm install uni-i18n --save
二、创建中英文切换的文件
1.英文en.js文件
2.中文zh_CN.js文件
三、 main.js中引用
// Vue i18n 国际化
import VueI18n from '@/common/vue-i18n.min.js';
Vue.use(VueI18n);// i18n 部分的配置，引入语言包，注意路径
import lang_zh_CN from '@/common/locales/zh_CN.js';
import lang_en from '@/common/locales/en.js';const i18n = new VueI18n({// 默认语言locale: 'zh_CN',// 引入语言文件messages: {'zh_CN': lang_zh_CN,'en': lang_en,}
});Vue.prototype._i18n = i18n;
const app = new Vue({i18n,...App
});
四、App.vue中设置默认值
<script>
export default {onShow() {this.$i18n.locale = 'zh_CN';//启动默认中文}
}
</script>
五、页面使用
1.template中使用
2.方法中使用
六、切换小程序中英文
1.按钮绑定事件
<view class="btn" @tap="switchLang"><u-icon size="46" color="warning" :name="lang"></u-icon></view>
2.监听当前的语言并且返回名字
computed: {lang() {return this.$i18n.locale == 'zh_CN' ? 'zh' : 'en';}},
3.切换项目的语言
switchLang() {this.$i18n.locale = this.$i18n.locale == 'zh_CN' ? 'en' : 'zh_CN';},
