切换·Esc 返回

评分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 日
商品评价 满意
课程内容评分
前端入门 · HTML 第一课
4.8
1,024 人评分 · 3,260 人在学
“讲得很清楚,小白也能跟上” —— 热门评价
客服满意度
本次服务满意吗?
客服小蜜 · 会话已结束
非常满意
餐厅打卡评分
山丘咖啡 · 南山店 3.5
环境不错,手冲偏酸 · 328 条点评