Ant-design-vue中select选择器（可搜索和清除）

记录一下Ant-design-vue知识点——select选择器

经常用，记录一下。

				<a-form-item label="" style="width: 200px">
                    <a-select show-search @change="handleChange" v-model:value="where.projectId" placeholder="请选择站点" style="" allow-clear>
                    <a-select-option v-for="(item, index) in shopList" :key="index" :value="item.projectId"
                        >{{ item.projectName }}
                    </a-select-option>
                    </a-select>
                </a-form-item>
//shopList是数组集合
//allow-clear是允许清除
//show-search是允许搜索
加上label-in-value   此时 value 是一个对象。
//:value="item.projectId"  选中后绑定的ID值
//{{ item.projectName }}  选中后要展示的值
//@change="handleChange"   数据发生改变时，change事件
//v-model:value="where.projectId"   需要用到的id

效果展示

补充：

label-in-value

默认情况下 onChange 里只能拿到 value，如果需要拿到选中的节点文本 label，可以使用 labelInValue 属性。 选中项的 label 会被包装到 value 中传递给 onChange 等函数，此时 value 是一个对象。