评分 Rate
用户完成一节线上课程后,用 1 到 5 颗星表达整体满意程度并提交评价。
前端与交互约 10 分钟 · 从真实需求理解
1为什么 Rate 要用有序星级表达评价?
课程评价
整体满意度
完成课程后,用 1–5 颗星表达体验
Rate 把一段体验压缩成有限且有顺序的评价等级:星星越多代表评价越高,用户不需要输入一个看似精确、却没有主观语义的数字。
- 每颗星都属于同一个评分尺度,当前填充数量就是用户选择的评价值。
- 提交后要保留已记录的星级,避免用户无法确认自己的评价是否生效。
2Rate 和数字输入、Slider 怎么区分?
Rate ≠ 任何带刻度的数字控件:Rate 表达有限级别的主观评价,Input Number 输入可参与计算的精确数字,Slider 调整连续范围中的位置。
- 课程满意度、服务体验等有序主观评价适合星级。
- 折扣比例、库存数量等精确数值需要数字输入;音量、亮度等连续量需要滑块。
先判断值的语义,再选择控件,不要把星星当成装饰图标或通用数字输入。
3一个 Rate 由哪些真实部分组成?
课程评价
整体满意度
完成课程后,用 1–5 颗星表达体验
Rate 的结构要让评价尺度、当前选中值和提交关系都清楚可见。
- Label 说明星级评价针对什么对象,星级组表达同一个有序尺度。
- 每颗星都是可操作的 radio 选项,填充数量反映当前值,键盘也能移动到目标级别。
- 提交入口和结果反馈要靠近评分,让用户知道评价是否已经记录。
4提交课程评分时,Rate 怎样回应?
记录课程整体满意度
Rate · 课程评价选择 1–5 星后提交整体体验
整体满意度请选择 1–5 星
用户完成课程后选择星级并提交,Rate 先显示提交中,完成后保留已记录的评分。
- 这条行为链证明星级是评价值,不是只在页面上闪烁的装饰。
5什么时候该用 Rate?
1–5 星直接表达课程整体满意度的有序主观判断。
有序的主观评价
折扣比例或数量要参与计算时,使用带单位和边界的 Input Number。
可直接输入,也可以按 1 件增减。
音量或亮度需要连续位置反馈时,Slider 比离散星级更合适。
先看值的语义:有限级别的主观体验适合 Rate;精确数值使用 Input Number,连续量程使用 Slider。
6怎样把 Rate 需求告诉 Agent?
请使用 Rate 实现课程结束评价:提供 1–5 星的有序评分,星级组要有清晰 label、支持键盘操作,选择后点击提交评分,页面显示提交中并在完成后保留“已记录 4 星”的结果。请把 Rate 用作主观体验评价,不要拿它代替需要精确计算的数字输入或连续量程滑块。
7不用背,看看你能不能判断
1 / 3
Rate 最适合表达哪类值?
请选择一个最符合题意的答案
社区延伸
看别人真实遇到过什么
社区帖子还没有关联到这个词条。