el-rate 半星评分
本文探讨如何在 el-rate 组件中实现每半颗星为 10 分的评分机制。
如何实现？
一个简单的解决方案是开启 el-rate 的 allow-half 属性，并将评分结果乘以 20，即可将 5 星 5 分评分制转换为 5 星百分制。
使用插槽
由于 el-rate 无法使用插槽，因此可以使用监听@mousemove 事件（使用 .native 修饰符），获取 el-rate 内部的 text 值，然后乘以 20 来实现半星评分。
示例代码
<template><el-rate :allow-half="true" :model-value="score" show-score></el-rate></template><script> import { debounce } from 'lodash'; export default { data() { return { score: 0, }; }, methods: { handleMouseMove(e) { const score = e.detAIl.value; this.score = score * 20; }, }, }; </script>
登录后复制
© 版权声明
文章版权归作者所有，未经允许请勿转载。
【小浪云服务商 - 服务器12元起 - 挂机宝5元起】
THE END
暂无评论内容