vue a-select 搜索匹配坑数据源是id 是数字

最新推荐文章于 2024-06-20 09:46:43 发布

迷途小书童ing

最新推荐文章于 2024-06-20 09:46:43 发布

阅读量609

点赞数

文章标签： vue.js

本文链接：https://blog.csdn.net/sinat_36017053/article/details/128111743

版权

博客详细讨论了Ant Design中组件的用法，包括设置optionFilterProp为'label'实现搜索功能，以及使用?key='item.tableId+item.tableName'确保key为字符串。示例代码展示了如何绑定数据、展示选项并定义label和value。

摘要由CSDN通过智能技术生成

坑点： 1.optionFilterProp=“label” 指定label 搜索 2. :key=“item.tableId+item.tableName” key 必须是个字符串item.tableId+‘ ’ 也可以

[
      options=  {
            "tableId": 20,
            "tableName": "product",
  
        }]
          <a-select
            v-model:value="formState.tableId"
            mode="multiple"
            :showSearch="true"
            style="width: 100%"
            optionFilterProp="label"
          >
            <a-select-option
              v-for="(item) in options"
              :key="item.tableId+item.tableName"
              :label="item.tableName"
              :value="item.tableId"
            >
              <div>
                {{ item.tableName }}
              </div>
            </a-select-option>
          </a-select>