微信小程序radio-group 组件的使用

wxml 文件代码如下:

<view class="change">
  <radio-group class="block lang_btn" bindchange="changeLanguage">
    <view class="cu-form-group margin-top">
      <view class="left_v"> 
        <view class="title">中文</view> 
      </view>
      <radio checked="{
         
  {lang==1?true:false}}" value=1></radio>
    </view>
    <view class="cu-form-group margin-top">
      <view class="left_v"> 
        <view class="title">English</view> 
      </view>
      <radio checked="{
         
  {lang==2?true:false}}" value=2></radio>
    </view> 
  </radio-group>
</view>

.wxss文件样式如下:

page{background:#fff;}
.choose-language {
  color: red;
  background: skyblue;
} 
.lang_btn {
  display: block;
}
.lang_btn2 {
  display: none;
} 
.lang_title {
  padding: 30rpx 30rpx;
  height: 60rpx;
  width: 100%;
}
.lang_btn .margin-top .left_v{
  display:flex;
  align-items: center;
} 
.lang_btn .margin-top .left_v .title{
  margin-left:26rpx;
} 
.change{padding:0 30rpx;}
 .change .titles{margin-top:76rpx;height:48rpx;line-height:48rpx;} 
 .change .titles text{font-size:36rpx;font-weight:550;color:#3C3D43;margin-left:24rpx;}

.js文件如下:

data: { 
    lang:1
  },
  changeLanguage: function(res) { 
    switch (res.detail.value) {
      case 1:
        wx.setStorageSync(Language, _zhong);
/**
   *  设置页面标题
   */
        wx.setNavigationBarTitle({
          title: _(切换语言)
        }); 
        break;
      case 2:
        wx.setStorageSync(Language, _ying);
        wx.setNavigationBarTitle({
          title: _(切换语言)
        }); 
        console.log(this.data._t, _["确定"])
        break;
      case 3:
        wx.setStorageSync(Language, _riyu);
        wx.setNavigationBarTitle({
          title: _(切换语言)
        }); 
        break;
      case 4:
        wx.setStorageSync(Language, _hanyu);
        wx.setNavigationBarTitle({
          title: _(切换语言)
        }); 
        break;
    }
/**
   *  设置页面下面的tab对应语言的文字
   */
    wx.setTabBarItem({
      index: 0,
      text: _("服务咨询")
    });
    wx.setTabBarItem({
      index: 1,
      text: _("问题反馈")
    })
    wx.setTabBarItem({
      index: 2,
      text: _("意见建议")
    });
    wx.setTabBarItem({
      index: 3,
      text: _("个人中心")
    })
   
  },
  onShow: function() {
    wx.hideHomeButton({}) 
    if (base.getLanguage() == _zhong) {
      this.setData({
        lang: 1,
      })
    } else if (base.getLanguage() == _ying) {
      this.setData({
        lang: 2,
      })
    } else if (base.getLanguage() == _riyu) {
      this.setData({
        lang: 3,
      })
    } else if (base.getLanguage() == _hanyu) {
      this.setData({
        lang: 4,
      })
    }
  },
经验分享 程序员 微信小程序 职场和发展