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