en-US

Search for options.

The search can be customized through dCustomSearch.

zh-CN

对选项进行搜索。

可通过 dCustomSearch 自定义搜索。

import { useState } from 'react';

import { DTransfer, DSwitch } from '@react-devui/ui';

const list = Array.from({ length: 100 }).map((_, index) => ({
  label: `Item ${index}`,
  value: index,
  disabled: index === 3,
}));
const search = {
  filter: (value, item) => {
    return item.label.endsWith(value);
  },
  sort: () => -1,
};
export default function Demo() {
  const [customSearch, setCustomSearch] = useState(false);

  return (
    <>
      <DTransfer dList={list} dSearchable dCustomSearch={customSearch ? search : undefined} />
      <br />
      <DSwitch dModel={customSearch} onModelChange={setCustomSearch}>
        Custom search
      </DSwitch>
    </>
  );
}