mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-24 15:46:10 +08:00
07072fc3b1
Related: #5610
1.1 KiB
1.1 KiB
order | title | ||||
---|---|---|---|---|---|
2 |
|
zh-CN
也可以直接传 AutoComplete.Option
作为 AutoComplete
的 children
,而非使用 dataSource
。
en-US
You could pass AutoComplete.Option
as children of AutoComplete
, instead of using dataSource
。
import { AutoComplete } from 'antd';
const Option = AutoComplete.Option;
class Complete extends React.Component {
state = {
result: [],
}
handleSearch = (value) => {
let result;
if (!value || value.indexOf('@') >= 0) {
result = [];
} else {
result = ['gmail.com', '163.com', 'qq.com'].map(domain => `${value}@${domain}`);
}
this.setState({ result });
}
render() {
const { result } = this.state;
const children = result.map((email) => {
return <Option key={email}>{email}</Option>;
});
return (
<AutoComplete
style={{ width: 200 }}
onSearch={this.handleSearch}
placeholder="input here"
>
{children}
</AutoComplete>
);
}
}
ReactDOM.render(<Complete />, mountNode);