微信小程序之实现五星评分的示例
这篇文章主要介绍了微信小程序 五星评分的实现实例的相关资料,这里提供实现实例帮助大家实现改功能,需要的朋友可以参考下
微信小程序 五星评分
五星级评分效果:
<view> <view> <block> <text>=index+1}}" style="padding-right: .5em" class="zan-c-red" data-star="{{index+1}}">★</text> <text>☆</text> </block> </view> <!--★--> <text>{{starMap[star-1]}}</text></view>
这里的zan-font-16,zan-c-red,zan-c-gray-dark是ZanUI-WeApp的样式。
这里的my-ib只是将设置display为inline-block。
Page({ data: { star: 0, starMap: [ '非常差', '差', '一般', '好', '非常好', ], }, myStarChoose(e) { let star = parseInt(e.target.dataset.star) || 0; this.setData({ star: star, }); }});
效果如图: