微信小程序點(diǎn)擊按鈕變顏色
前端頁(yè)面：
<view class="navs" wx:for="{{itemlist}}" wx:for-index="index">
<view class="{{data-index=== index? 'choose' : 'noChoose'}}" bindtap="changeColor" data-
info="{{index}}">
{{item}}
</view>
</view>js：
Page({
data: {
data-index: "1",
itemlist:["按鈕1","按鈕2","按鈕3"]
},
changeColor(e) {
console.log(e) // 打印按鈕的index
this.setData({
index1: e.target.dataset.info
})
},
})CSS:
.navs .choose {
background-color: blue;
color: white;
}
.navs .noChoose {
background-color: white;
color: black;
}效果圖：
文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-765439.html
?文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-765439.html
到了這里，關(guān)于微信小程序點(diǎn)擊按鈕變顏色的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
