javascript/element-plus
1
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2026-03-13 07:51:17 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(components): [select-v2] fix default-first-option and allow-create are not effective together (#20872)

Browse Source 
fix(components): [select-v2] fix default-first-option

closed #20871
This commit is contained in:
kooriookami
2025-05-29 16:27:44 +08:00
committed by GitHub
parent e01a1439c0
commit e4a93aae74
3 changed files with 8 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/en-US/component/select-v2.md
View File

@@ -121,7 +121,7 @@ select-v2/custom-footer
Create and select new items that are not included in select options
By using the `allow-create` attribute, users can create new items by typing in the input box. Note that for `allow-create` to work, `filterable` must be `true`.
By using the `allow-create` attribute, users can create new items by typing in the input box. Note that for `allow-create` to work, `filterable` must be `true`. This example also demonstrates `default-first-option`. When this attribute is set to `true`, you can select the first option in the current option list by hitting enter without having to navigate with mouse or arrow keys.
:::tip
@@ -250,6 +250,7 @@ select-v2/custom-width
| loading | whether Select is loading data from server | ^[boolean] | false |
| loading-text | displayed text while loading data from server, default is 'Loading' | ^[string] | — |
| reserve-keyword | whether reserve the keyword after select filtered option. | ^[boolean] | true |
| default-first-option | select first matching option on enter key. Use with `filterable` or `remote` | ^[boolean] | false |
| no-match-text | displayed text when no data matches the filtering query, you can also use slot `empty`, default is 'No matching data' | ^[string] | — |
| no-data-text | displayed text when there is no options, you can also use slot empty | ^[string] | No Data |
| popper-class | custom class name for Select's dropdown | ^[string] | '' |

3
docs/examples/select-v2/allow-create.vue
View File

@@ -7,6 +7,7 @@
placeholder="Please select"
style="width: 240px; margin-right: 16px; vertical-align: middle"
allow-create
default-first-option
filterable
multiple
clearable
@@ -17,6 +18,7 @@
placeholder="Please select"
style="width: 240px; vertical-align: middle"
allow-create
default-first-option
filterable
clearable
/>
@@ -31,6 +33,7 @@
placeholder="Please select"
style="width: 240px; margin-right: 16px; vertical-align: middle"
allow-create
default-first-option
filterable
multiple
clearable

4
packages/components/select-v2/src/useSelect.ts
View File

@@ -430,7 +430,9 @@ const useSelect = (props: ISelectV2Props, emit: SelectEmitFn) => {
expanded.value = true
}
createNewOption(states.inputValue)
handleQueryChange(states.inputValue)
nextTick(() => {
handleQueryChange(states.inputValue)
})
}
const debouncedOnInputChange = lodashDebounce(onInputChange, debounce.value)