修改a-rate评分颜色；a-rate评分十分制

本文主要是介绍修改a-rate评分颜色；a-rate评分十分制，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

使用ant-design-vue的rate评分组件
1。修改颜色
2。十分制（默认是5分，改成10分。且提示也是10分制）

<a-rate v-model="score" :tooltips="rate10" allow-half @hoverChange="changeRate" />data() {score: 7, // 分值乘以和除以 2 即可完成十分制rate10: ['2', '4', '6', '8', '10'],},created() {this.score = this.score / 2  // 回显除以2// this.score = this.score * 2  // 提交给后端乘以2},// 十分制提示changeRate(e) {console.log(e)if (Number.isInteger(e)) {this.rate10 = ['2', '4', '6', '8', '10']} else {this.rate10 = ['1', '3', '5', '7', '9']}},css配色:（如果想做成不同评分渐变色，可以通过score的值来动态改变打分颜色；现在是固定配色）// 打分颜色
::v-deep .ant-rate-star-full, ::v-deep .ant-rate-star-half  {color:#007d7b!important;
}

这篇关于修改a-rate评分颜色；a-rate评分十分制的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---