mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-05 05:28:20 +08:00
c5a043b4c8
+ add `getSuggestionContainer` callback function, which allow users modify the container element of suggestions dropdown. + the suggestions dropdown will mount on `document.body` defaultly, instead of on editor. + close #3588
1.1 KiB
1.1 KiB
order | title | ||||
---|---|---|---|---|---|
1 |
|
zh-CN
匹配内容列表为异步返回时。
en-US
async
import { Mention } from 'antd';
const users = ['afc163', 'benjycui', 'yiminghe', 'jljsj33', 'dqaria', 'RaoHai'];
const AsyncMention = React.createClass({
getInitialState() {
return {
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%', height: 100 }}
loading={loading}
suggestions={suggestions}
onSearchChange={this.onSearchChange}
/>
);
},
});
ReactDOM.render(
<AsyncMention />,
mountNode
);