ivew使用星星评分

这组件好像有问题,不知道是我们项目环境造成的还是什么,初始化半星不能正常显示,显示的全星。

1.template

<div style="display:inline-block;margin-right:100px;vertical-align:3px;">
  <span style="font-size:16px;color:#fff;line-height:20px;vertical-align:-3px;">评分:</span>
  <Rate allow-half show-text v-model="startValue" @on-change='getScore'><span style="color: #f5a623;display: inline-block; 30px;">{{ startValue}}分</span></Rate>
</div>

2.在data中设置星星的数量绑定

data () {
    return {
        startValue: 0, // 评分级别
        score: 0, // 评分级别
    }
}

3.methods

可以通过on-change触发星星改变事件

// 得到分数
getScore () {
    this.score = this.startValue
},
原文地址:https://www.cnblogs.com/wgl0126/p/11015241.html