Rate 评分

评分组件,组件名:uni-rate,代码块: uRate。

使用方式:

script 中引用组件

  1. import uniRate from "@/components/uni-rate/uni-rate.vue"
  2. export default {
  3. components: {uniRate}
  4. }

基本用法

  1. <uni-rate value="2"></uni-rate>

自定义星星大小

  1. <uni-rate size="18" value="5"></uni-rate>

设置评分数

  1. <uni-rate max="10" value="5"></uni-rate>

不可点击状态

  1. <uni-rate disabled="true" value="3.5"></uni-rate>

属性说明:

属性名类型默认值说明
valueNumber0当前评分
maxNumber5最大的评分
sizeNumber24星星的大小
marginNumber0星星的间距
colorString#ececec星星的颜色
active-colorString#ffca3e选中状态的星星的颜色
is-fillBooleantrue星星的类型,是否为实心类型
disabledBooleanfalse是否为不可点击状态

事件说明:

事件称名说明返回参数
changeRate 的 value 改变时触发事件,返回参数为Rate的value{value:Number}

Tips