
html
<view class="gradelist">
<view class="flex jsb ac">
<text class="gradelistitle">喜欢作者</text>
<!-- <text class="gradelisotherprice" @click="otherpicebutton(1)">其他金额</text> -->
</view>
<view class="gradelis flex flexwrap">
<view class="gradeli flex jc ac" v-for="(item,index) in rewardpricelist" :key="index"
@click.stop="fun_reward(item)" >
¥{{item}}</view>
</view>
</view>js
//打赏
async fun_reward(price) {
//里面写逻辑
},css
.gradelist {
padding: 30rpx;
background: #f5f5f5;
border-radius: 8rpx;
box-sizing: border-box;
border-radius: 12rpx;
margin-top: 30rpx;
.gradelistitle {
color: #999;
font-size: 28rpx;
}
.gradelisotherprice {
color: steelblue;
font-size: 28rpx;
}
.gradelis {
width: 100%;
margin-top: 30rpx;
}
.gradeli {
width: 31%;
height: 100rpx;
background: #fff;
margin-right: 3%;
border-radius: 8rpx;
margin-bottom: 20rpx;
font-size: 28rpx;
font-weight: bold;
}
.gradeli:nth-child(3n+3) {
margin-right: 0 !important;
}
}到此这篇关于uniapp 微信小程序 金额展示套餐的文章就介绍到这了,更多相关uniapp 微信小程序 金额展示套餐内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!
发表评论