微信小程序 for循环添加样式1

微信小程序 for循环添加样式1

 

wxml:

<view class=‘kjcz_list‘> 
    <block wx:for="{{kjcz_object}}" wx:key="{index}">
    <view class="kjcz_content {{num==index?‘current‘:‘‘}}" catchtap=‘switchTab‘  data-index="{{index}}">
      <view>{{item.kjcz_cz}}</view>
      <view class=‘{{item.h_class}}‘>赠送:{{item.kjcz_zs}}元</view>
    </view>
    </block> 
    <view class="kjcz_content {{define==false?‘current‘:‘‘}}" catchtap=‘switchTab1‘>
      <view>自定义金额</view>
    </view>
  </view> 
  <view class=‘look_data‘>点击查看余额/充值记录</view>
  <view class=‘dz_m‘>到账金额:¥{{totalNum}}</view>
  <view class=‘zf_now‘>立即充值({{czNum}})</view>

 

js:

data: {
    num:0,
    czNum:2000,
    define:true,
    totalNum:2100,
    kjcz_object:[
      {
        kjcz_cz:"2000元",
        kjcz_zs:"100",
      },
      {
        kjcz_cz: "5000元",
        kjcz_zs: "1000"
      },
      {
        kjcz_cz: "10000元",
        kjcz_zs: "3000"
      },
      {
        kjcz_cz: "20000元",
        kjcz_zs: "10000"
      },
      {
        kjcz_cz: "5000元",
        kjcz_zs: "1000"
      }
    ]
  },
  switchTab: function (e) {
    let index = parseInt(e.currentTarget.dataset.index);
    var that = this
    var cz_num = that.data.kjcz_object[index].kjcz_cz;
    cz_num=parseInt(cz_num.substring(0,cz_num.length-1));
    var kjcz_zs=parseInt(that.data.kjcz_object[index].kjcz_zs);
    var cz_total=cz_num+kjcz_zs;
    // console.log(cz_num)
    that.setData({
      num: index,
      czNum: cz_num,
      define:true,
      totalNum:cz_total
    })
  },
  switchTab1:function(e){
    var that=this;
    let define = that.data.define;
     define=!define;
    that.setData({
      define:define,
      num:5
    })
  },

 

微信小程序 for循环添加样式1

上一篇:【leetcode】Candy


下一篇:微信小程序 从本地相册选择图片或使用相机拍照chooseImage()和预览图片previewImage()