<u-popup :show="showA" mode="bottom" round="32">
<view class="popupA">
<view class="popupA_one">
<view class="one_txt" style="color: royalblue;margin-left: 32rpx;" @click="cancelone()">取消</view>
<view class="one_txt" style="color: limegreen;margin-right: 32rpx;" @click="btnone()">确定</view>
</view>
<!-- tasteGroupId -->
<scroll-view class="viewscroll" style="height: 480rpx;width: 100%;margin-top: 12rpx;" scroll-y="true">
<view class="baseone"
:style="item.disabled?'background-color: #ffffff;':'background-color: #e4e7ed;'"
:disabled="item.disabled" v-for="item,index in tasteList" @click="clickItem(index)">
<view style="height: 32rpx;width: 32rpx;"></view>
<view class="txt">{{item.tasteGroupName}}</view>
<view
style="margin-right: 32rpx;color: royalblue;font-size: 32rpx;font-weight: 500;width: 32rpx;"
v-if="item.disabled">√</view>
<view
style="margin-right: 32rpx;color: royalblue;font-size: 32rpx;font-weight: 500;width: 32rpx;"
v-else></view>
</view>
</scroll-view>
</view>
</u-popup>
js部分
gettasteGroupList() {
tasteGroupList().then(res => {
if (res.data.length > 0) {
res.data.forEach(el => {
el.disabled = false;
el.checked = false;
})
}
// console.log("1111");
this.tasteList = res.data;
// 调用请求商品详情数据的方法
if (this.goods.goodsId != null) {
this.getGoodsDetail(this.goods.goodsId)
}
})
},
css 部分
.popupA {
width: 100%;
background-color: #e4e7ed;
height: 600rpx;
.popupA_one {
width: 100%;
height: 96rpx;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #ffffff;
font-size: 32rpx;
font-weight: 400;
}
.viewscroll {
.baseone {
width: 100%;
height: 96rpx;
display: flex;
align-items: center;
justify-content: space-between;
.txt {
font-size: 32rpx;
font-weight: 400;
}
}
}
}