diff --git a/packages/components/dropdown/__tests__/dropdown-menu.test.tsx b/packages/components/dropdown/__tests__/dropdown-menu.test.tsx index dd1880ad53..eb2f60955e 100644 --- a/packages/components/dropdown/__tests__/dropdown-menu.test.tsx +++ b/packages/components/dropdown/__tests__/dropdown-menu.test.tsx @@ -181,10 +181,18 @@ describe('DropdownMenu', () => { }); it('renders empty menu when no options', () => { - // 由于 DropdownMenu 在 onMounted 中会查询 .t-dropdown__item, - // 当没有选项时会报错,所以这里跳过这个测试 - // 实际使用中,DropdownMenu 总是会有至少一个选项 - expect(true).toBe(true); + // 修复后,DropdownMenu 在没有选项时不会崩溃 + const wrapper = mount(DropdownMenu, { + props: { + options: [], + }, + attachTo: document.body, + }); + + expect(wrapper.exists()).toBe(true); + expect(wrapper.find('.t-dropdown__menu').exists()).toBe(true); + expect(wrapper.findAll('.t-dropdown__item').length).toBe(0); + wrapper.unmount(); }); }); diff --git a/packages/components/dropdown/dropdown-menu.tsx b/packages/components/dropdown/dropdown-menu.tsx index d6ac426df7..6a6a3d563f 100644 --- a/packages/components/dropdown/dropdown-menu.tsx +++ b/packages/components/dropdown/dropdown-menu.tsx @@ -40,7 +40,10 @@ export default defineComponent({ const menuHeight = parseInt(window?.getComputedStyle(menuRef.value).height, 10); if (menuHeight >= props.maxHeight) isOverMaxHeight.value = true; } - itemHeight.value = document.querySelector(`.${dropdownClass.value}__item`).scrollHeight + 2; + const dropdownItem = document.querySelector(`.${dropdownClass.value}__item`); + if (dropdownItem) { + itemHeight.value = dropdownItem.scrollHeight + 2; + } }); const getContent = (content: string | TNode) => {