微信小程序实现多国语言的切换

实现步骤:

1,首先在根目录新建文件夹 i18n，该文件夹下是 各种语言的js文件，如下图所示：

每个js文件内容和下面的图片类似；

const languageMap = {
  "授权完成":"授权完成",
  "完善信息成功":"完善信息成功"
}
module.exports = {
 languageMap:languageMap
}

2，新建base.js文件，位置和app.js同级别即可，也可自行安排位置；里面内容如下

function getLanguage() { 
  //返回缓存中的language属性 (_zhong/_ying/_riyu/_hanyu)
  return wx.getStorageSync('Language') || '_zhong'
}; 
function translate() { 
  //返回翻译的对照信息
  return require('i18n/' + getLanguage() + '.js').languageMap;
}  
function translateTxt(desc) {
  //翻译	
  return translate()[desc] || '竟然没有翻译';
} 
module.exports = {
  getLanguage: getLanguage,
  _t: translate,
  _: translateTxt 
}

3，在页面中使用：

首先在页面 js文件中引入base.js;  var base = require('../../base.js');

然后在onShow生命周期函数中 写入： 

 onShow(){
 this.setData({ 
   _t: base._t() 
 });
}

写在onShow生命周期函数中每次进入该页面，都加载数据，虽然降低了性能，但是保证切换语言之后，页面的文字能随时变化；（（（切换语言主要是用了微信小程序的组件radio-group，改变缓存中的一个变量，该变量是用于确定当前选择的是何种语言的标志；在步骤1中有四个js文件，分别是“_hanyu.js”，“_riyu.js” ，“_ying.js”，“_zhong.js”,

通过单选按钮将对应的文件名放入缓存；-------单选按钮的详细部分在其他文章中说明-----https://mp.csdn.net/postedit/104198619；）））

这样页面js文件的data对象里就有了对应语言的数据，在wxml页面中可以通过双花括号获取数据；

例如：{{_t["授权完成"]}}

OVER,OVER