微信小程序實現多國語言的切換

實現步驟:

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頁面中可以通過雙花括號獲取數據；

例如：<text>{{_t["授權完成"]}}</text>

OVER,OVER