ant-design/components/auto-complete/demo/status.tsx
thinkasany 05a0179616
demo(AutoComplete): opt options type by AutoCompleteProps (#49768)
* demo(AutoComplete): opt options type by AutoCompleteProps

* lint fix
2024-07-08 16:01:02 +08:00

35 lines
1023 B
TypeScript

import React, { useState } from 'react';
import { AutoComplete, Space } from 'antd';
import type { AutoCompleteProps } from 'antd';
const mockVal = (str: string, repeat = 1) => ({
value: str.repeat(repeat),
});
const App: React.FC = () => {
const [options, setOptions] = useState<AutoCompleteProps['options']>([]);
const [anotherOptions, setAnotherOptions] = useState<AutoCompleteProps['options']>([]);
const getPanelValue = (searchText: string) =>
!searchText ? [] : [mockVal(searchText), mockVal(searchText, 2), mockVal(searchText, 3)];
return (
<Space direction="vertical" style={{ width: '100%' }}>
<AutoComplete
options={options}
onSearch={(text) => setOptions(getPanelValue(text))}
status="error"
style={{ width: 200 }}
/>
<AutoComplete
options={anotherOptions}
onSearch={(text) => setAnotherOptions(getPanelValue(text))}
status="warning"
style={{ width: 200 }}
/>
</Space>
);
};
export default App;