微信小程序 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
    })
  },

 

转载于:https://www.cnblogs.com/jvziking/p/8462828.html