欢迎来到代码驿站!

当前位置:首页 >

小程序多语言的切换

时间:2020-03-13 21:06:43|栏目:|点击:
小程序有时候会遇到需要更改语言的切换,如果引用网上翻译的api个人觉得比较麻烦,所以还是老老实实的自己写一个js作为文本语言的切换。也算是投机取巧吧,不适合太多内容的转换。

简单举个例子
首先需要新建一个外部js文档,将接口暴露。
var json = [{
  "Language": "语言设置",
  "Changepwd": "密码修改",
  "Updated": "更新版本",
  "Hotline": "客服热线",
  "Signout": "退出登录",
  "Login": "登录",
  "Forgetpwd": "忘记密码",
  "Language": "语言切换",
}, {
  "Language": "Language settings",
  "Changepwd": "Change Password",
  "Updated": "Updated Version",
  "Hotline": "Hotline",
  "Signout": "Sign Out",
  "Login": "login",
  "Forgetpwd": "forget password",
  "Language": "Language switching",
}]
// 定义数据出口
module.exports = {
  dataList: json
}
因为需求是中英互换,所以分别设置两个json,然后暴露接口。

然后就是在所需要的页面引入该js

const lang = require('../../external/resources/language.js');

要实现切换功能就需要有一个选择框,最简单的是一个底部弹出框。同时设置一个全局缓存的标识wx.setStorageSync('mark', mark),用于判定语言的切换,并且如果是英文的话,需要更改底部导航栏的文字wx.setTabBarItem。

languagechange: function (e) {
  var that = this
  mark = ''
  wx.showActionSheet({
    itemList: ['中文', 'English'],
    success(res) {
      wx.clearStorageSync()
      if (0 == res.tapIndex) {
        dl = lang.dataList[0]
        mark = 0
        wx.setStorageSync('mark', mark)
        wx.reLaunch({
          url: '../Personal/index',
        })
        wx.setTabBarItem({
          index: 0,
          "text": "首页"
        })
        wx.setTabBarItem({
          index: 1,
          "text": "设备",
        })
        wx.setTabBarItem({
          index: 2,
          "text": "事件"
        })
        wx.setTabBarItem({
          index: 3,
          "text": "设置"
        })
        that.setData({
          datalist: dl
        })
      }
      if (1 == res.tapIndex) {
        dl = lang.dataList[1]	//选择是哪一个json,也就是选择语言变量
        mark = 1
        wx.setStorageSync('mark', mark)
        wx.reLaunch({
          url: '../Home/index',
        })
        that.setData({
          datalist: dl
        })
      }
    }
  })
},

效果图供大家参考

小程序多语言的切换

小程序多语言的切换

小程序多语言的切换

上一篇:Java 判断是否为大写字母几种方法

栏    目:

下一篇:R语言ggplot2边框背景去除的实现

本文标题:小程序多语言的切换

本文地址:http://www.codeinn.net/misctech/2213.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有