mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 20:49:53 +08:00
parent
d0dee05c28
commit
b916f7c247
@ -21,11 +21,11 @@ When there is a need for autocomplete functionality.
|
||||
| children (for customize input element) | customize input element | HTMLInputElement <br /><br /> HTMLTextAreaElement <br /><br /> `React.ReactElement<InputProps>` | `<Input />` | |
|
||||
| children (for dataSource) | Data source to auto complete | `React.ReactElement<OptionProps>` <br /><br /> `Array<React.ReactElement<OptionProps>>` | - | |
|
||||
| defaultActiveFirstOption | Whether active first option by default | boolean | true | |
|
||||
| defaultValue | Initial selected option. | string\|string\[] | - | |
|
||||
| defaultValue | Initial selected option. | string | - | |
|
||||
| disabled | Whether disabled select | boolean | false | |
|
||||
| filterOption | If true, filter options by input, if function, filter options against it. The function will receive two arguments, `inputValue` and `option`, if the function returns `true`, the option will be included in the filtered set; Otherwise, it will be excluded. | boolean or function(inputValue, option) | true | |
|
||||
| placeholder | placeholder of input | string | - | |
|
||||
| value | selected option | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | - | |
|
||||
| value | selected option | string | - | |
|
||||
| onBlur | Called when leaving the component. | function() | - | |
|
||||
| onChange | Called when select an option or input value change, or value of input is changed | function(value) | - | |
|
||||
| onFocus | Called when entering the component | function() | - | |
|
||||
@ -49,3 +49,7 @@ When there is a need for autocomplete functionality.
|
||||
Please use `onChange` to manage control state. `onSearch` is used for searching input which is not same as `onChange`. Besides, clicking on the option will not trigger the `onSearch` event.
|
||||
|
||||
Related issue: [#18230](https://github.com/ant-design/ant-design/issues/18230) [#17916](https://github.com/ant-design/ant-design/issues/17916)
|
||||
|
||||
### Part of api from v3 not available in v4?
|
||||
|
||||
AutoComplete is a Input component support auto complete tips which should not support `labelInValue` prop to modify dispaly value in input. In v3, AutoComplete realization can not handle case that user type match of both `value` & `label` are the same. v4 not longer support `label` as the value input.
|
||||
|
@ -22,12 +22,12 @@ title: AutoComplete
|
||||
| children (自定义输入框) | 自定义输入框 | HTMLInputElement <br /><br /> HTMLTextAreaElement <br /><br /> `React.ReactElement<InputProps>` | `<Input />` | |
|
||||
| children (自动完成的数据源) | 自动完成的数据源 | `React.ReactElement<OptionProps>` <br /><br /> `Array<React.ReactElement<OptionProps>>` | - | |
|
||||
| defaultActiveFirstOption | 是否默认高亮第一个选项。 | boolean | true | |
|
||||
| defaultValue | 指定默认选中的条目 | string\|string\[]\| 无 | |
|
||||
| defaultValue | 指定默认选中的条目 | string | 无 | |
|
||||
| disabled | 是否禁用 | boolean | false | |
|
||||
| filterOption | 是否根据输入项进行筛选。当其为一个函数时,会接收 `inputValue` `option` 两个参数,当 `option` 符合筛选条件时,应返回 `true`,反之则返回 `false`。 | boolean or function(inputValue, option) | true | |
|
||||
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。[示例](https://codesandbox.io/s/4j168r7jw0) | Function(triggerNode) | () => document.body | |
|
||||
| placeholder | 输入框提示 | string | - | |
|
||||
| value | 指定当前选中的条目 | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | 无 | |
|
||||
| value | 指定当前选中的条目 | string | 无 | |
|
||||
| onBlur | 失去焦点时的回调 | function() | - | |
|
||||
| onChange | 选中 option,或 input 的 value 变化时,调用此函数 | function(value) | 无 | |
|
||||
| onFocus | 获得焦点时的回调 | function() | - | |
|
||||
@ -51,3 +51,7 @@ title: AutoComplete
|
||||
请使用 `onChange` 进行受控管理。`onSearch` 触发于搜索输入,与 `onChange` 时机不同。此外,点选选项时也不会触发 `onSearch` 事件。
|
||||
|
||||
相关 issue:[#18230](https://github.com/ant-design/ant-design/issues/18230) [#17916](https://github.com/ant-design/ant-design/issues/17916)
|
||||
|
||||
### v3 的部分属性为何在 v4 中没有了?
|
||||
|
||||
AutoComplete 组件是一个支持自动提示的 Input 组件,因而其不具有 `labelInValue` 等影响 value 展示的属性。在 v3 版本,AutoComplete 实现存在输入值如果遇到 `value` 与 `label` 相同时无法映射的问题。 v4 中不在支持 `label` 为值的输入形态。
|
||||
|
Loading…
Reference in New Issue
Block a user