在微信小程式裡面不使用checkbox怎麼實作view的多選
wxml檔案
<block wx:for="{{itemList}}" wx:key="id">
<view class='item_container' bindtap='itemSelected' data-index='{{index}}'>
<image class='select_icon' src="{{item.isSelected?'/image/selected.png':'/image/unselected.png'}}"></image>
<text class='text'>{{item.name}}</text>
</view>
</block>
js檔案
data: {
itemList: [
{ id: 1, name: 'C語言', isSelected: false, },
{ id: 2, name: 'Java', isSelected: false, },
{ id: 3, name: 'C++', isSelected: false, },
]
},
itemSelected: function (e) {
var index = e.currentTarget.dataset.index;
var item = this.data.itemList[index];
item.isSelected = !item.isSelected;
this.setData({
itemList: this.data.itemList,
});
}