Rate 评分，对评价进行展示或对事物进行快速的评级操作。

支持平台

App（vue）	App（nvue）	H5	小程序
✓	✓	✓	✓

代码演示

部分示例演示，完整使用请参考文档API。

温馨提示

组件内部使用了wui-icon（字体图标）组件，非 easycom 组件模式下需要手动引入组件（打开组件内部注释的引入内容，引入路径按实际调整）。

基础使用

通过 @change 得到评分数据。

<wui-rate @change="change"></wui-rate>

const change = e => {
    //返回评分 e.score
    console.log(e);
};

设置颜色

通过 color 属性设置未选中时颜色，activeColor 属性设置选中时颜色。

<wui-rate color="#888" activeColor="#465CFF" @change="change"></wui-rate>

const change = e => {
    //返回评分 e.score
    console.log(e);
};

设置大小

通过 size 属性设置星星大小。

<wui-rate :size="48" @change="change"></wui-rate>

const change = e => {
    //返回评分 e.score
    console.log(e);
};

支持半星

通过 allowHalf 属性设置是否支持半星评级或展示。

const change = e => {
    //返回评分 e.score
    console.log(e);
};

Slots

插槽名称	说明
-	-

Props

属性名	类型	说明	默认值	平台差异说明
max	Number, String	最大评分/星星数量	5	-
score	Number, String	当前评分，小数仅支持0.5	0	-
color	String	星星未选中的颜色	#CCCCCC	-
activeColor	String	星星选中状态颜色	#FFB703	-
disabled	Boolean	是否禁用点击	false	-
size	Number, String	星星大小，单位rpx	56	-
activeIcon	String	选中时的图标名	star-fill	-
inactiveIcon	String	未选中时的图标名	star	-
halfIcon	String	半星图标	starhalf	-
spacing	Number, String	星星间距，单位rpx	0	-
allowHalf	Boolean	是否支持半星选择或展示	false	-
halfRate	Number, String	超过多少比例选中半星（取值区间0~0.5）	0.2	-
touchable	Boolean	是否支持滑动手势	true	-
param	Number, String	自定义参数，@change事件回传	0	-

Events

事件名	说明	回调参数
@change	评分改变时触发	{ score:评分 param:自定义参数 }