carefree-fuzzy-query v2.0.3

FuzzyQuery 模糊查询

依赖安装

 npm i carefree-fuzzy-query

参数

更多参数

类型

export interface FuzzyQueryProps extends SelectProps<any> {
  /** 表格标题 */
  columns?: TablesProps['columns'];
  /** 请求 */
  request: (
    params: any,
  ) => Promise<{ label: any; value: any; [s: string]: any }[]>;
  /** 延迟时间 */
  debounceTimeout?: number;
  /** 提示框 宽度 */
  tipWidth?: number;
}

案例

import 'antd/dist/reset.css';
import FuzzyQuery from 'carefree-fuzzy-query';
import React from 'react';

const Query = () => {
  const [value, setValue] = React.useState([]);
  // 根据key模糊查询组织
  const selectLike = async () => {
    return Array.from({ length: 20 }).map((_, index) => {
      return {
        label: `名称---${index}`,
        phone: index,
      };
    });
  };
  return (
    <div>
      <FuzzyQuery
        request={selectLike}
        mode="multiple"
        value={value}
        onChange={setValue}
        placeholder="请选择"
        columns={[
          { dataIndex: 'label', title: '用户名' },
          { dataIndex: 'phone', title: '电话' },
        ]}
        fieldNames={{ value: 'phone' }}
      />
    </div>
  );
};
export default Query;