评分 Rate
支持图片和图标两种资源格式,默认为图标资源
设置默认选中数
通过score
属性设置默认选中数,支持小数点
示例代码
<l-rate score="3" />
<l-rate score="3.6" size="56" />
<l-rate score="3.8" size="56" />
通过 size
属性设置组件元素的大小,传入数值单位为:rpx
示例代码
自定义颜色
示例代码
<l-rate active-color="#FFDD55" inActive-color="#FFF5CE" />
自定义图标分两种情况:
1 使用 Lin UI
提供的 icon
组件内的图标;
2 使用自定义图标库扩展的图标;
第一种通过 属性匹配对应的icon即可;第二种场景使用步骤如下:
- 将自定义图标库写入
wxss
中,通过@font-face
定义字体,font-family
必须为:iconfont
- 设置带有
content
属性class
为l-icon-name
格式,name
值与在rate
组件上设置的name
属性值保持一致;
示例代码
<l-rate score="4" name="like" />
<l-rate score="4" name="shouye" active-color="#F4516C"
自定义图片
通过active-image
设置选中时图片资源;
通过inActive-image
设置选中时图片资源;
默认图片宽高为80rpx
,可通过外部样式类 l-class-image
自定义样式。
设置评分元素个数
通过 count
属性设置评分组件内元素个数,默认是5个。
<l-rate score="3" count="10" bind:linChange="changeScore" />
评分属性 (Rate Attributes)
事件名称 | 说明 | 返回值 | 备注 |
---|---|---|---|
bind:linchange | 单击选中评分时触发 | 当前选择的个数 score | - |