mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-05 05:28:20 +08:00
1.0 KiB
1.0 KiB
order | title | ||||
---|---|---|---|---|---|
1 |
|
zh-CN
匹配内容列表为异步返回时。
en-US
async
import { Mention } from 'antd';
const users = ['afc163', 'benjycui', 'yiminghe', 'jljsj33', 'dqaria', 'RaoHai'];
class AsyncMention extends React.Component {
state = {
suggestions: [],
loading: false,
}
fetchSuggestions = (value, callback) => {
setTimeout(() => {
callback(users.filter(item => item.indexOf(value) !== -1));
}, 500);
}
onSearchChange = (value) => {
this.fetchSuggestions(value, (suggestions) => {
this.setState({
suggestions,
loading: false,
});
});
this.setState({
loading: true,
});
}
render() {
const { suggestions, loading } = this.state;
return (
<Mention
style={{ width: '100%' }}
loading={loading}
suggestions={suggestions}
onSearchChange={this.onSearchChange}
/>
);
}
}
ReactDOM.render(<AsyncMention />, mountNode);