<view>
<view class="eval_box">
<view v-for="(item, index) in ratetext" :key="index" class="rate_box">
<text class="tx_wb">{{ item }}</text>
<!-- for五条介绍 -->
<view class="star_box">
<view
class="StarsWrap"
v-for="(i, index) in list"
:key="index"
@click="clickStars(index)"
>
<!-- for 五个星星 -->
<image :src="xing > index ? stara : starb"></image>
<!-- 判断点的星星是第几个 大于的话用亮星 -->
</view>
<text style="color: #ff6200; font-size: 26rpx">{{
rateScoreText
}}</text>
</view>
</view>
</view>
export default {
name: "evaluate",
data() {
return {
rateScoreText: "",
rateScoreDesc: ["很不满意", "稍不满意", "一般", "满意", "很满意"],
ratetext: [
"送货司机",
"搬运员工",
"业务经理",
"商品质量",
"商品价格",
"产品交货期",
],
stara: "./../../static/image/20200708144629175.png", //亮星星
list: [{
scoredesc:'很不满意',
xing:0
},
{
scoredesc:'稍不满意',
xing:1
},
{
scoredesc:'一般',
xing:2
},
{
scoredesc:'满意',
xing:3
},
{
scoredesc:'很满意',
xing:4
},
],
starb: "./../../static/image/20200708144629178.png", //暗星星
xing: 0,
};
},
methods: {
clickStars(i) {
this.rateScoreText = this.list[i].scoredesc;
this.xing = i + 1;
console.log(this. xing)
// console.log("点击了" + (i + 1) + "颗星");
},
我for出来 一点全亮了 我想一行归一行的去走..啥原因啊