多选与追问
Questionnaire / Clarification
用单选、多选或自由回答补足 Agent 尚不明确的需求。
app.mjs
import { mount } from '@sofish/ui/browser';
const view = mount(
document.querySelector('#example'),
'questionnaire',
{
"demo": true
}
);
view.element.addEventListener('ui:submit', event => {
console.log(event.detail.value);
});
// view.update({ ...nextProps });
// view.destroy();什么时候用
答案会实质影响下一步,且可给出有限、清晰的选项。
什么时候不用
系统已掌握答案时不要重复问;开放问题别强行套选项。
COMPONENT API
属性与事件
传入业务数据,通过事件连接你的应用。
| 属性 | 默认值 |
|---|---|
label | "你想先了解哪类组件?" |
name | "interest" |
items | ["Agent 交互","通用组件"] |
multiple | false |
required | true |
submitLabel | "确认选择" |
demo | false |
事件
ui:submit
INTERACTION NOTES
交互与可访问性
- 用 fieldset 与 legend 表达问题。
- 保留原生单选、多选和键盘行为。
和相似组件的区别
追问收集信息;审批要求授权。两者的选项含义不同。
RESEARCH & ALTERNATIVES
官方实现映射
以下是上游生态对同类交互的实现。上方运行的是 UI 自己的组件。
关键状态
React / Next.js · 来源核验