《微信小程序案例2》如何动态给css样式增加或删除class类

微信小程序是不能像一般浏览器开发使用js一样获取dom节点信息并修改css样式的。这里需要结合数据绑定，数据中的data中选择状态的设置一个true变量，未选中的设置一个false变量

 接着在wxml代码中为class属性使用三元运算

class="{
    
    {item.select ? 'active' : 'noactive'}}"
//item.select 代表当前的是否选中状态，若为true则class=active。
//若为false则class=noactive

 <view wx:for="{
    
    {itemList}}">
    <span class="{
    
    {item.select ? 'active' : 'noactive'}}">{
    
    {item.name}}</span>
 </view>

  data: {
    itemList: [
      {name: '推荐', id: 0, select: true},
      {name: 'Xiaomi手机', id: 1, select: false},
      {name: 'Redmi手机', id: 2, select: false},
      {name: '游戏手机', id: 3, select: false},
      {name: '电脑平板', id: 4, select: false},
      {name: '智能穿戴', id: 5, select: false},
      {name: '电视', id: 6, select: false},
      {name: '大家电', id: 7, select: false},
      {name: '小家电', id: 8, select: false},
      {name: '智能家居', id: 9, select: false},
      {name: '出行运动', id: 10, select: false},
      {name: '日用百货', id: 11, select: false},
      {name: '儿童用品', id: 12, select: false},
    ]
    },

 上面基本构思已经完成，最后只需要通过点击事件bindtap来控制选择状态，点击哪一个标签，该标签的select状态变为true，上一个选择状态的标签则变为false状态，实现动态增加和删除css样式。