mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-05 01:19:45 +08:00
6776bb8916
* docs: update demo * chore: add script * test: fix demo test * docs: convert demos * chore: move script * test: remove react-dom import * chore: update deps * docs: update riddle js * test: fix image test * docs: fix riddle demo
1.0 KiB
1.0 KiB
| order | title | ||||
|---|---|---|---|---|---|
| 2 |
|
zh-CN
也可以直接传 AutoComplete.Option 作为 AutoComplete 的 children，而非使用 options。
en-US
You could pass AutoComplete.Option as children of AutoComplete, instead of using options。
import React, { useState } from 'react';
import { AutoComplete } from 'antd';
const { Option } = AutoComplete;
const Complete: React.FC = () => {
const [result, setResult] = useState<string[]>([]);
const handleSearch = (value: string) => {
let res: string[] = [];
if (!value || value.indexOf('@') >= 0) {
res = [];
} else {
res = ['gmail.com', '163.com', 'qq.com'].map(domain => `${value}@${domain}`);
}
setResult(res);
};
return (
<AutoComplete style={{ width: 200 }} onSearch={handleSearch} placeholder="input here">
{result.map((email: string) => (
<Option key={email} value={email}>
{email}
</Option>
))}
</AutoComplete>
);
};
export default () => <Complete />;