en-US

Customize options and buttons.

zh-CN

自定义选项和按钮。

import { InfoCircleOutlined, DoubleRightOutlined, DoubleLeftOutlined } from '@react-devui/icons';
import { DTransfer, DButton } from '@react-devui/ui';

const list = Array.from({ length: 100 }).map((_, index) => ({
  label: `Item ${index}`,
  value: index,
  disabled: index === 3,
}));
export default function Demo() {
  return (
    <DTransfer
      dList={list}
      dCustomItem={(item) => (
        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
          {item.label}
          <InfoCircleOutlined />
        </div>
      )}
      dActions={[
        <DButton dType="secondary" dIcon={<DoubleRightOutlined />}></DButton>,
        'right',
        'left',
        <DButton dType="secondary" dIcon={<DoubleLeftOutlined />}></DButton>,
      ]}
    />
  );
}