微信小程序wx:if条件选择器 遍历数组案例
微信小程序wx:if条件选择器案例微信小程序wx:if条件选择器案例
具体的文档我就不在啰嗦了下面是我写的一大个例子：.
场景需求：按照后台传 but 的字段，改变对应数据的css样式，
**根据字段改变前面的图标，是同理，**
1.index.wxml
注意这个地方wx:if="{{item.but === ‘c’ }}" 是全等 = = =
2.index.js{{item.ss}}: {{item.ss}} {{item.ss}}
Page({ /** * 页面的初始数据 */ data: { text: [ { ss: "第一条数据---111", but:"a"}, { ss: "第二条数据---222", but: "b" }, { ss: "第三条数据---333", but: "c" }, { ss: "第四条数据---444", but: "c" }, { ss: "第五条数据---555", but: "a" }, { ss: "第六条数据---666", but: "b" } ] },3.index.wxss样式写的很随意，主要是懒 得整理，
.bg_black { height: 60rpx; background:#000; border-bottom: 1px solid #2b2e33; margin: 10rpx; color: #fff; opacity: 0.4;}.bg_red { height: 80rpx; background:#000; border-bottom: 1px solid #2b2e33; margin: 10rpx; color: #fff; opacity: 0.6;}.bg_green{ height: 50rpx; background:#000; border-bottom: 1px solid #2b2e33; margin: 10rpx; color: #fff; opacity: 0.8;}本来是这样的:
处理完是这样的:
