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