WSelectV2 组件

A2UI Protocol JSON Schema

虚拟化下拉选择组件，基于 WinDesignNext Select V2 封装，适用于大数据量选项场景，通过虚拟滚动提升渲染性能。用法与 WSelect 类似，支持 modelValue 数据绑定、options/dataSource 选项加载及 action 事件响应。

与 WSelect 的区别：WSelectV2 内置虚拟列表，适合数千条以上选项；可通过 height、itemHeight 调节下拉面板尺寸。

基础用法

API

属性	类型	默认值	说明
component	string	WSelectV2	组件类型（必填）
modelValue	DataBindingValue	—	选中值绑定，支持 path 双向绑定
options	array	—	静态选项列表，与 dataSource 二选一
dataSource	string	—	从 dataModel 加载选项的路径
height	number | DataBindingValue	274	下拉面板高度（px）
itemHeight	number | DataBindingValue	32	每个选项行高（px）
multiple	boolean	false	是否多选
filterable	boolean	false	是否可搜索
clearable	boolean	false	是否可清空
placeholder	string	—	占位文本
valueKey	string	value	对象选项的唯一键字段
action	Action	—	选择变化时触发的事件

path 支持说明

WSelectV2 支持通过 A2UI 数据绑定对象（path / literalXxx）动态引用 dataModel 中的值。

属性	path 支持	说明
modelValue	✅	选中值双向绑定，变化后写回 dataModel
dataSource	✅（路径字符串）	指向 dataModel 中选项数组的路径
height	✅	下拉面板高度，适合动态布局
itemHeight	✅	选项行高

modelValue 数据绑定

{ "modelValue": { "path": "/city" } }

多选时使用数组：

{ "modelValue": { "path": "/selectedIds" } }

dataSource 动态选项

{
  "component": "WSelectV2",
  "dataSource": "/cityOptions",
  "modelValue": { "path": "/city" }
}

action 定义

{
  "action": {
    "event": {
      "name": "onCityChange",
      "type": "change",
      "context": [{ "key": "city", "value": { "path": "/city" } }]
    }
  }
}

数据同步机制

1. Agent 发送 updateComponents 定义组件，modelValue.path 指向 dataModel 路径
2. Agent 发送 updateDataModel 初始化选项和选中值
3. 用户选择后，渲染器自动调用 setData 更新 dataModel
4. 若配置了 action，同时触发 A2UI 事件

使用场景

场景	推荐配置
大量城市/药品选项	静态 options + height: 300
动态远程选项	dataSource + filterable: true
多选标签	multiple: true
对象值绑定	valueKey + modelValue.path

注意事项

• 虚拟列表要求选项 label 为单行文本，超长文本建议配合 filterable 搜索
• A2UI JSON 不支持 remoteMethod、filterMethod 等函数属性
• 选项格式与 WSelect 一致：{ value, label, disabled? }