初入微信小程序项目样式问题

如何实现上图中点击高亮，不同的切换，点击高亮的效果，这个问题该怎么解决？有谁知道吗

第一步: 定义一个class，设置样式为你想要的结果

.active { 你想要的样式 }

第二步：在节点中添加 data-index='图中节点的顺序'，并添加点击事件 bindtap='changeTab'

<view class='box {{tabIndex == 1? "active" : ""}}' data-index='1' bindtap='changeTab'>第一个盒子</view>
<view class='box {{tabIndex == 2? "active" : ""}}' data-index='2' bindtap='changeTab'>第二个盒子</view>
<view class='box {{tabIndex == 3? "active" : ""}}' data-index='3' bindtap='changeTab'>第三个盒子</view>

第三步：在data中定义变量 tabIndex，默认设置为 -1

data: {
  tabIndex: -1
}

第四步：点击事件逻辑，点击节点时，将tabIndex设置为当前点击的节点

changeTab(e) {
  this.setData({
    tabIndex: e.currentTarget.dataset.index
  })
}

这个是一个图标或者图片 点击 时 让 本行的图片显示 其它行消失 。wx:if可以控制

你可以循环时给数据 加一个 show属性 来控制 图标是否显示 。
点击时 点击事件传挡墙id(唯一标识)，然后循环对比 ，改变数据

比如 data.map((item)=>{
item.show=false;
if(item.id==id){
item.show=true;
}
})