微信小程序点击切换高亮

要实现点击切换高亮的效果，可以使用以下步骤：

1. 给需要点击的元素绑定 tap 事件。
2. 在 tap 事件处理函数中，通过获取当前元素的 data-* 属性值，来判断当前元素是否已经被高亮。
3. 如果当前元素没有被高亮，就给它添加一个高亮的 class。如果当前元素已经被高亮，就把它的高亮 class 移除。

下面是一个简单的示例代码：

wxml：

<view class="item" data-active="{{active}}" data-index="{{index}}" bindtap="onTap">
  {{item}}
</view>

css：

.item {
  height: 50px;
  line-height: 50px;
  text-align: center;
  background-color: #fff;
  border: 1px solid #ddd;
}

.item.active {
  background-color: #f00;
  color: #fff;
}

js：

Page({
  data: {
    list: ['item1', 'item2', 'item3'],
    activeIndex: -1
  },

  onTap: function(e) {
    var index = e.currentTarget.dataset.index;
    var active = e.currentTarget.dataset.active;
    if (!active) {
      this.setData({
        activeIndex: index
      });
    } else {
      this.setData({
        activeIndex: -1
      });
    }
  }
})

在上面的示例代码中，我们给每一个需要点击的元素设置了两个 data-* 属性，一个是 data-active 表示当前元素是否被高亮，另一个是 data-index 表示当前元素的索引。在 tap 事件处理函数中，我们先通过 e.currentTarget.dataset.index 获取当前元素的索引，然后再通过 e.currentTarget.dataset.active 判断当前元素是否已经被高亮。如果当前元素没有被高亮，就给它添加一个 active 的 class，否则就移除它的 active class。最后，我们使用 this.setData() 方法更新 activeIndex 的值，从而触发页面的重新渲染。