微信小程序星级评分和展示

正文：用户点击第几颗星星就显示为几星评分wxml文件代码<view class=‘assess_sec_img’> <block wx:for="{{empty_star}}" wx:key=“index”> <image catchtap=‘in_xin’ id=’{{index+1}}’ data-in=‘use_sc2’ src=’../../img/star_img.png’ class=‘assess_star_img’></image> </block> <block wx:for="{{full_star}}" wx:key=“index”> <image catchtap=‘in_xin’ id=’{{index+1}}’ data-in=‘use_sc’ src=’../../img/star_imgs.png’ class=‘assess_star_img’></image> </block></view>wxss文件代码.assess_sec .assess_sec_star .assess_sec_img{ width: 530rpx; height: 160rpx; display: flex; align-items: center; float: left;}.assess_sec .assess_sec_star .assess_sec_img .assess_star_img{ width: 47rpx; height: 46rpx; float: left; margin: 0 10rpx; }js文件代码Page({ /** * 页面的初始数据 */ data: { empty_star: 0, //未选择星星 full_star: 5 //已选择星星 }, // 用户给评分 in_xin: function(e) { var that = this; console.log(e); var in_xin = e.currentTarget.dataset.in; var empty_star; if (in_xin === ‘use_sc2’) { empty_star = Number(e.currentTarget.id) - 1; console.log(empty_star); } else { empty_star = Number(e.currentTarget.id) + that.data.empty_star; console.log(empty_star); } this.setData({ empty_star: empty_star, full_star: 5 - empty_star }) },})原文链接：https://blog.csdn.net/qq_3571…