共计 1084 个字符，预计需要花费 3 分钟才能阅读完成。
正文：用户点击第几颗星星就显示为几星评分
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…
