码迷,mamicode.com
首页 > 微信 > 详细

微信小程序点击列表添加 去除属性

时间:2019-01-29 20:31:23      阅读:219      评论:0      收藏:0      [点我收藏+]

标签:message   col   数据   去除   添加   this   微信   场景   item   

首先说一下场景:我所循环的数据是对象数组,设置了一个属性当作标记,通过这个标记的值判断是否给改元素添加样式

wxml:

<view>
      <view wx:for="{{list}}" wx:key="num" class="list" >
        <text bindtap=‘changColor‘  data-index=‘{{index}}‘ class=‘{{item.check?"text-active":""}}‘ >| {{item.message}}</text>
      </view>
</view>

js:

/*
  这里获取list是一个数组对象
  tomorrow: [
    {
      thing: ‘吃饭‘,
      check: false
    },
    {
      thing: ‘睡觉‘,
      check: false
    },
    { 
      thing: ‘打豆豆‘,
      check: false
    }
  ]
*/
changColor: function (e) { let index = e.currentTarget.dataset.index let arrs = this.data.list; if (arrs[index].check == false) { arrs[index].check = true; } else { arrs[index].check = false; } this.setData({ list: arrs }) },

核心在于修改对象属性check的值,然后在元素渲染是根据值进行样式的添加

微信小程序点击列表添加 去除属性

标签:message   col   数据   去除   添加   this   微信   场景   item   

原文地址:https://www.cnblogs.com/yan-captain/p/10335440.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!