小程序开发:改变data中数组或对象的某一属性值

最近在做一个小程序页面的时候需要在一个列表渲染里点中一个view,这个view背景变白,其他的view保持原始状态背景蓝色。

效果如图。

代码情况如下:

<view class="modelLayout2">
<view class="timeSelection" hover-class='pressed' hover-stay-time='100' wx:for="{{timeSelectionList}}" >

<view>

 

  ....
 dateList:[
     {
       month:4,
       day:24,
       classVar: "dateLayout",/**样式变量 按下是dateLayoutPressed 正常是dateLayout */
     },
     {
       month:4,
       day:25,
       classVar: "dateLayoutPressed",/**样式变量 按下是dateLayoutPressed 正常是dateLayout */
     }
   ],
....
timeSelectionClick:function(e){
    console.log("wdwqdqwd")
    var i = e.currentTarget.dataset.index;
   var array=this.data.dateList;
   array.forEach((item,index,attr)=>{
    var allItem="dateList["+index+"].classVar";
    this.setData({
      [allItem]:"dateLayout"
    })
    if(index==i){
      var allItem1 = "dateList[" + index + "].classVar";
      this.setData({
        [allItem1]:"dateLayoutPressed"
      })
    }
   })
  }

总的来说,需要主要两个点:wx:key的设置,然后就是循环遍历设置view的样式就可以了

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值