ant-design/components/select/demo/custom-label-render.tsx
2024-09-11 13:51:00 +08:00

28 lines
631 B
TypeScript

import React from 'react';
import { Select } from 'antd';
import type { SelectProps } from 'antd';
type LabelRender = SelectProps['labelRender'];
const options = [
{ label: 'gold', value: 'gold' },
{ label: 'lime', value: 'lime' },
{ label: 'green', value: 'green' },
{ label: 'cyan', value: 'cyan' },
];
const labelRender: LabelRender = (props) => {
const { label, value } = props;
if (label) {
return value;
}
return <span>No option match</span>;
};
const App: React.FC = () => (
<Select labelRender={labelRender} defaultValue="1" style={{ width: '100%' }} options={options} />
);
export default App;