ant-design / pro-components

🏆 Use Ant Design like a Pro!
https://pro-components.antdigital.dev
MIT License
4.3k stars 1.36k forks source link

🐛[BUG] ProTable查询表格 查询表单查询没有进行模糊筛选 #8562

Open 299Julys opened 3 months ago

299Julys commented 3 months ago

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

🐛 bug 描述

输入单个字母o或c时,没有筛选出对应的数据,筛选单个字母a时是正常的; 将label设置为item.name时筛选正常

📷 复现步骤

仅输入一个字母,如o、C

🏞 期望结果

输入单个字母时查询结果正常

💻 复现代码

import { ProTable } from "@ant-design/pro-components";
import { DefaultOptionType } from "antd/es/select";
const dataSource = [
  {
    id: "1",
    num: "OT203",
    name: "测",
  },
  {
    id: "2",
    num: "A22-SA22",
    name: "测试",
  },
  {
    id: "3",
    num: "C2-TGH4",
    name: "测试221",
  },
  {
    id: "4",
    num: "C23-cH9",
    name: "测试122",
  },
];
const list = [
  {
    id: "1",
    num: "OT203",
    name: "12",
  },
  {
    id: "2",
    num: "A22-SA22",
    name: "测试222",
  },
  {
    id: "3",
    num: "C22GTH2",
    name: "12121",
  },
  {
    id: "4",
    num: "C23CH9",
    name: "项目cH",
  },
  {
    id: "6",
    num: "C12-TCH3",
    name: "项目TCH2",
  },
  {
    id: "8",
    num: "C23-SAL0",
    name: "SAL0",
  },
  {
    id: "9",
    num: "B23-SAL9",
    name: "SAL20221",
  },
  {
    id: "11",
    num: "C219IT01",
    name: "IT11",
  },
];

const columns = [
  {
    title: "编号",
    dataIndex: "num",
    valueType: "select",
    fieldProps: {
      showSearch: true,
      options: list?.map((item) => ({
        value: item.num,
        label: (
          <>
            <span>{item.num}</span>
            <br />
            <span>{item.name}</span>
          </>
        ),
      })) as DefaultOptionType[],
      optionFilterProp: "value",
      filterOption: true,
    },
  },
  {
    title: "名称",
    dataIndex: "name",
    search: false,
  },
];

export default () => {
  return (
    <ProTable
      columns={columns}
      cardBordered
      dataSource={dataSource}
      rowKey="id"
      search={{
        labelWidth: "auto",
      }}
      pagination={false}
      headerTitle="高级表格"
    />
  );
};

© 版本信息

-@antd-design/icons 5.3.7 -@antd-design/pro-components 2.7.11 -antd 5.19.1 -react 18.3.1 -umi-request 1.4.0 -react-dom 18.3.1 -浏览器 microsoft edge

🚑 其他信息

screenshot-1720777036457