feat(select): add onClear prop (#719)

* feat(NSelect): add onClear

* feat: optimization

* Apply suggestions from code review

* Update src/select/src/Select.tsx

Co-authored-by: 07akioni <07akioni2@gmail.com>
This commit is contained in:
XieZongChen 2021-07-29 11:18:12 -05:00 committed by GitHub
parent f1c7d7c5b6
commit 92fd9c4da9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 1 deletions

View File

@ -55,9 +55,10 @@ render-tag
| value | `Array<string \| number> \| string \| number \| null` | `undefined` | Value in controlled mode. |
| virtual-scroll | `boolean` | `true` | Whether to enable virtual scrolling. |
| on-blur | `() => void` | `undefined` | Callback triggered when selection blur. |
| on-clear | `() => void` | `undefined` | Callback triggered when selection clear. |
| on-create | `(label: string) => SelectOption` | `label => ({ label, value: label })` | How to create a option when you input a string to create a option. Note that `filter` will be applied to the created option too. And make sure the value of the created option is not the same as any other option. |
| on-focus | `() => void` | `undefined` | Callback triggered when selection focus. |
| on-scroll | `(e: ScrollEvent) => void` | `undefined` | Callback triggered when menu scroll. |
| on-scroll | `(e: ScrollEvent) => void` | `undefined` | Callback triggered when menu scroll. |
| on-search | `(value: string) => void` | `undefined` | Callback triggered when search. |
| on-update:value | `(value: Array \| string \| number \| null) => void` | `undefined` | Callback triggered when value updating. |

View File

@ -61,6 +61,7 @@ options-change-debug
| value | `Array<string \| number> \| string \| number \| null` | `undefined` | 受控模式下的值 |
| virtual-scroll | `boolean` | `true` | 是否启用虚拟滚动 |
| on-blur | `() => void` | `undefined` | `blur` 时执行的回调 |
| on-clear | `() => void` | `undefined` | `clear` 时执行的回调 |
| on-create | `(label: string) => SelectOption` | `label => ({ label, value: label })` | 在输入内容时如何创建一个选项。注意 `filter` 对这个生成的选项同样会生效。同时确保这个选项和其他选项的 `value` 不要有重复 |
| on-focus | `() => void` | `undefined` | `focus` 时执行的回调 |
| on-scroll | `(e: ScrollEvent) => void` | `undefined` | 滚动时执行的回调 |

View File

@ -141,6 +141,7 @@ const selectProps = {
onBlur: [Function, Array] as PropType<
MaybeArray<(e: FocusEvent) => void> | undefined
>,
onClear: [Function, Array] as PropType<MaybeArray<() => void> | undefined>,
onFocus: [Function, Array] as PropType<
MaybeArray<(e: FocusEvent) => void> | undefined
>,
@ -331,6 +332,10 @@ export default defineComponent({
if (onBlur) call(onBlur, e)
nTriggerFormBlur()
}
function doClear (): void {
const { onClear } = props
if (onClear) call(onClear)
}
function doFocus (e: FocusEvent): void {
const { onFocus } = props
const { nTriggerFormFocus } = formItem
@ -530,6 +535,7 @@ export default defineComponent({
if (!multiple && props.filterable) {
closeMenu()
}
doClear()
if (multiple) {
doUpdateValue([])
} else {