小程式 列表點選變色
阿新 • • 發佈:2019-01-27
工作日誌 隨手筆記 僅供參考
通過點選時候判斷點選的是哪一個,然後判斷item ==shopitem 使之變色
<view class='shop_list' >
<view class="shop_item{{item == shopitem?'active':''}}" wx:for="{{shop}}" bindtap='bindshop' data-classify="{{item}}" >{{item}}</view>
</view>
data:{ shop:['預設排序','最新上拍','即將結拍'], shopitem:'預設排序' //預設顯示的 }
bindshop:function(event){
var classify = event.currentTarget.dataset.classify;
var that = this;
console.log(classify) //輸出的結果就是你點選的
this.setData({
shopitem: classify, //更新
})
},
/*商品分類 */ .shop { background: white } .shop_list { display: flex; padding: 30rpx 40rpx; justify-content: space-around; } .shop_item { font-size: 30rpx; color: #555 } .shop_itemactive { font-size: 30rpx; color: red; }