mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2024-11-21 01:02:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(components): [autocomplete] can not fetch suggestions after clear (#6847)

Browse Source 
* fix(components): [autocomplete] can not fetch suggestions after clear

* style: define valuePresented constant
This commit is contained in:
bqy_fe 2022-03-29 15:48:50 +08:00 committed by GitHub
parent 58ca971e39
commit c05bc511a8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/examples/input/autocomplete.vue
View File

@ -7,6 +7,7 @@
<el-autocomplete
v-model="state1"
:fetch-suggestions="querySearch"
clearable
class="inline-input"
placeholder="Please Input"
@select="handleSelect"
@ -20,6 +21,7 @@
v-model="state2"
:fetch-suggestions="querySearch"
:trigger-on-focus="false"
clearable
class="inline-input"
placeholder="Please Input"
@select="handleSelect"

10
packages/components/autocomplete/src/autocomplete.vue
View File

@ -128,6 +128,7 @@ const { compatTeleported } = useDeprecateAppendToBody(
COMPONENT_NAME,
'popperAppendToBody'
)
let isClear = false
const attrs = useAttrs()
const compAttrs = useCompAttrs()
const suggestions = ref<any[]>([])
@ -191,15 +192,21 @@ const getData = (queryString: string) => {
}
const debouncedGetData = debounce(getData, props.debounce)
const handleInput = (value: string) => {
const valuePresented = Boolean(value)
emit('input', value)
emit(UPDATE_MODEL_EVENT, value)
suggestionDisabled.value = false
activated.value = Boolean(value)
activated.value ||= isClear && valuePresented
if (!props.triggerOnFocus && !value) {
suggestionDisabled.value = true
suggestions.value = []
return
}
if (isClear && valuePresented) {
isClear = false
}
debouncedGetData(value)
}
const handleChange = (value: string) => {
@ -217,6 +224,7 @@ const handleBlur = (evt: FocusEvent) => {
}
const handleClear = () => {
activated.value = false
isClear = true
emit(UPDATE_MODEL_EVENT, '')
emit('clear')
}