数据录入与表单有已知边界

NnSelect 选择器

单选、多选与标签输入。

示例

API

Props

名称	类型	默认值	说明
value	unknown | unknown[]	—	单选模式为一个值；multiple/tags 模式应传数组。配合 v-model:value。
options	SelectOptionData[] | Primitive[]	[]	数据选项；原始值会同时作为 label 和 value。会与默认插槽中的 NnSelectOption 合并。
mode	string	''	multiple 或 tags 启用多选，其余值为单选。
allowClear	boolean	false	有值且非禁用时显示清除按钮。
disabled	boolean	false	禁用选择器；若此时下拉层已打开，会关闭并触发 dropdownVisibleChange(false)。
loading	boolean	false	显示加载状态，下拉层中不显示选项。
placeholder	string	''	无值时的占位文字。
status	string	''	error 使用错误样式；其他值没有专用样式。

interface SelectOptionData {
    value: unknown;
    label?: string | number | VNode | VNode[] | (() => unknown);
    disabled?: boolean;
    // 其他字段会保留在 change 的 option 载荷中
    [key: string]: unknown;
}

值比较使用 Object.is。若使用对象作为 value，父组件和选项必须持有同一个对象引用才能匹配。 函数型 label 可以在下拉项中渲染，但选中态无法从函数本身提取文字，会回退显示 String(value)； 不含可提取文本的复杂 VNode 也会回退到 value。

Events

事件	参数	说明
update:value	(value: unknown | unknown[] | undefined)	选择、移除或清除时触发。多选返回数组；单选清除返回 undefined。
change	(value, option)	单选的 option 是原始选项对象；多选是当前已选原始选项数组；清除与 value 对应为 undefined 或 []。
dropdownVisibleChange	(open: boolean)	下拉层打开或关闭时触发。

Slots

名称	作用域参数	说明
default	—	声明 NnSelectOption。解析器只收集直接子节点或 Fragment 中的 NnSelectOption。

Expose

名称	签名	说明
focus	() => void	聚焦选择器根节点。
blur	() => void	移除根节点焦点。

当前限制

• tags 当前与 multiple 行为相同，没有文本输入或创建自由标签的能力。
• 当前没有搜索、过滤、分组选项、远程加载回调或受控 open Prop。
• options 与插槽选项是追加合并关系；若两处声明相同 value，不会自动去重。