vben admin 下拉支持收索
你现在写的配置里有点混用了 ApiSelect 和 TreeSelect 的配置。
📌 说明:
ApiSelect
本身是支持搜索的,但它的搜索逻辑需要通过showSearch: true
配合filterOption
,而不是treeNodeFilterProp
(那个是TreeSelect
的属性)。如果你需要通过
meetingName
来搜索,可以在componentProps
里加上filterOption
,手动指定用meetingName
过滤。
✅ 改写成 ApiSelect 搜索配置示例:
{ label: '来源', field: 'sourceMeeting', required: true, component: 'ApiSelect', componentProps: { api: getMeeting, labelField: 'meetingName', valueField: 'id', showSearch: true, filterOption: (input: string, option: any) => { return option.label.toLowerCase().includes(input.toLowerCase()); }, }, }
这样就能在输入时按照 meetingName 进行搜索了。
如果你本来就是想用 TreeSelect
(树形结构搜索),那就改用你注释掉的那部分:
{ label: '来源会议', field: 'sourceMeeting', required: true, component: 'TreeSelect', componentProps: { treeData: await getMeeting(), showSearch: true, treeNodeFilterProp: 'meetingName', virtual: true, fieldNames: { label: 'meetingName', value: 'id', }, }, }