From 72f9ba2ba53c7af4bf3ebbcbcaf86ec920f74a1e Mon Sep 17 00:00:00 2001 From: Rainbow <1256734885@qq.com> Date: Sat, 18 Oct 2025 17:23:52 +0800 Subject: [PATCH] fix(components): [select-v2] avoid displaying 'false' incorrectly during remote search (#22495) fix(components): [select-v2] avoid displaying 'false' incorrectly --- .../select-v2/__tests__/select.test.ts | 34 +++++++++++++++++++ .../components/select-v2/src/useSelect.ts | 7 ++-- 2 files changed, 39 insertions(+), 2 deletions(-) diff --git a/packages/components/select-v2/__tests__/select.test.ts b/packages/components/select-v2/__tests__/select.test.ts index c5a259ae82..5381d8d1ec 100644 --- a/packages/components/select-v2/__tests__/select.test.ts +++ b/packages/components/select-v2/__tests__/select.test.ts @@ -2501,4 +2501,38 @@ describe('Select', () => { expect(wrapper.find('.custom-tag').text()).toBe('enabled') }) }) + + it('loading appears on first click when remote', async () => { + const wrapper = _mount( + ` + + `, + { + data() { + return { options: [], value: '', loading: false } + }, + methods: { + remoteMethod() { + this.loading = true + setTimeout(() => { + this.loading = false + }, 1000) + }, + }, + } + ) + + const select = wrapper.findComponent(Select) + const selectVm = select.vm as any + const input = wrapper.find('input') + await input.trigger('click') + expect(selectVm.dropdownMenuVisible).toBeTruthy() + }) }) diff --git a/packages/components/select-v2/src/useSelect.ts b/packages/components/select-v2/src/useSelect.ts index aa04cb4dc6..ac50095a7f 100644 --- a/packages/components/select-v2/src/useSelect.ts +++ b/packages/components/select-v2/src/useSelect.ts @@ -181,12 +181,15 @@ const useSelect = (props: SelectV2Props, emit: SelectV2EmitFn) => { const debounce = computed(() => (props.remote ? 300 : 0)) + const isRemoteSearchEmpty = computed( + () => props.remote && !states.inputValue && !hasOptions.value + ) + // filteredOptions includes flatten the data into one dimensional array. const emptyText = computed(() => { if (props.loading) { return props.loadingText || t('el.select.loading') } else { - if (props.remote && !states.inputValue && !hasOptions.value) return false if ( props.filterable && states.inputValue && @@ -387,7 +390,7 @@ const useSelect = (props: SelectV2Props, emit: SelectV2EmitFn) => { const dropdownMenuVisible = computed({ get() { - return expanded.value && emptyText.value !== false + return expanded.value && (props.loading || !isRemoteSearchEmpty.value) }, set(val: boolean) { expanded.value = val