diff --git a/components/select/demo/custom-dropdown-menu.md b/components/select/demo/custom-dropdown-menu.md index a39b4071c035..cbd03743a19c 100644 --- a/components/select/demo/custom-dropdown-menu.md +++ b/components/select/demo/custom-dropdown-menu.md @@ -7,34 +7,59 @@ title: ## zh-CN -使用 `dropdownRender` 对下拉菜单进行自由扩展。 +使用 `dropdownRender` 对下拉菜单进行自由扩展。自定义内容点击时会关闭浮层,如果不喜欢关闭,可以添加 `onMouseDown={e => e.preventDefault()}` 进行阻止(更多详情见 [#13448](https://github.com/ant-design/ant-design/issues/13448))。 ## en-US -Customize the dropdown menu via `dropdownRender`. +Customize the dropdown menu via `dropdownRender`. The selection will be closed if click `dropdownRender` area, you can prevent it by wrapping `onMouseDown={e => e.preventDefault()}` (see more at [#13448](https://github.com/ant-design/ant-design/issues/13448)). ```jsx import { Select, Icon, Divider } from 'antd'; const { Option } = Select; -ReactDOM.render( - , - mountNode, -); +let index = 0; + +class App extends React.Component { + state = { + items: ['jack', 'lucy'], + }; + + addItem = () => { + console.log('addItem'); + const { items } = this.state; + this.setState({ + items: [...items, `New item ${index++}`], + }); + }; + + render() { + const { items } = this.state; + return ( + + ); + } +} + +ReactDOM.render(, mountNode); ``` diff --git a/components/select/index.en-US.md b/components/select/index.en-US.md index 915038237254..3392595de643 100644 --- a/components/select/index.en-US.md +++ b/components/select/index.en-US.md @@ -94,3 +94,9 @@ Select component to select value from options. | -------- | ----------- | --------------------- | ------- | ------- | | key | | string | - | | | label | Group label | string\|React.Element | - | | + +## FAQ + +### The dropdown is closed when click `dropdownRender` area? + +See the [dropdownRender example](/components/select/#components-select-demo-custom-dropdown-menu). diff --git a/components/select/index.zh-CN.md b/components/select/index.zh-CN.md index 16b85325179f..3d32e38ee830 100644 --- a/components/select/index.zh-CN.md +++ b/components/select/index.zh-CN.md @@ -97,3 +97,9 @@ title: Select | ----- | ---- | --------------------- | ------ | ---- | | key | | string | - | | | label | 组名 | string\|React.Element | 无 | | + +## FAQ + +### 点击 `dropdownRender` 里的内容浮层关闭怎么办? + +看下 [dropdownRender 例子](/components/select-cn/#components-select-demo-custom-dropdown-menu) 里的说明。