评分Rate
填写与选择用星级或等级表达评价
评分控件让用户在一组有顺序的等级中表达满意程度,常见形式是五颗星。除了图形,还要显示可读的分值或文字,并让键盘和读屏用户也能完成选择。
★★★★★半星 · 3.5
★★★★★4.8只读展示
什么时候用
- 订单、商品评价:交易后的标准动作蓝牙耳机★★★★★4.0
- 满意度调查:低成本收集反馈本次服务满意吗?★★★★★
- 半星表达更细的程度★★★★★3.5 分
- 只读展示综合评分和评分人数★★★★★4.81,024 人评分
什么时候不用
- 只想知道赞 / 不赞 → 点赞按钮更干脆♥ 点赞 328非黑即白时,点赞更干脆
- 0~10 分推荐度(NPS)→ 星星数不过来你愿意推荐给朋友吗?★★★★★★★★★★10 颗星数到眼花
- 想知道低分的原因 → 搭配 多行文本域 Textarea 收文字★★★★★菜有点咸,但服务很好……
- 买几件这类精确数量 → 用 数字输入框 InputNumber购买数量★★★★★买几件靠数星星?
组成结构 · Anatomy
★★★★★
4 分 · 满意
1评分整体Rate通常五颗,数量和图标都可换
2星星Star实心已选、空心未选,支持半颗
3辅助文案Text分值和对应感受,如“4 分 · 满意”
常见变体 · Variants
默认Default
★★★★★
五星制打分,表达几分满意
半星Half Star
★★★★★3.5
想要更细的分数粒度时
只读展示Readonly
★★★★★4.8
展示综合评分,不让用户改
自定义图标Custom Icon
♥♥♥♥♥
想要品牌感,用爱心等图形替换星星
典型使用场景
电商订单评价
无线蓝牙耳机
交易成功 · 7 月 18 日
商品评价
★★★★★
满意
课程内容评分
客服满意度
本次服务满意吗?
客服小蜜 · 会话已结束
★★★★★
非常满意
餐厅打卡评分