tdesign-vue-next
tdesign-vue-next copied to clipboard
[dropdown] 生产模式下,在vue3.4.x,tabs→tab-panel→组件中使用dropdown报错
tdesign-vue-next 版本
1.8.1
重现链接
No response
重现步骤
<template>
<div>
<tabs>
<tab-panel
v-for="(item, index) in tabList"
:key="index"
:label="item.label"
:value="item.value"
>
<template #label>
<dropdown
:min-column-width="128"
:popup-props="{
overlayClassName: 'route-tabs-dropdown',
onVisibleChange: (visible: boolean, ctx: PopupVisibleChangeContext) =>
handleTabMenuClick(visible, ctx, item.value),
visible: active === item.value,
}"
>
{{ item.label }}
<template #dropdown>
<dropdown-menu>
<dropdown-item>
<refresh-icon />
123321
</dropdown-item>
</dropdown-menu>
</template>
</dropdown>
</template>
</tab-panel>
</tabs>
</div>
</template>
<script setup lang="ts">
import { PopupVisibleChangeContext } from "tdesign-vue-next/es/popup/type";
import { ref } from "vue";
import {
Tabs,
TabPanel,
Dropdown,
DropdownMenu,
DropdownItem,
} from "tdesign-vue-next";
const tabList = [
{
label: "选项卡一",
value: 1,
},
{
label: "选项卡二",
value: 2,
},
{
label: "选项卡三",
value: 3,
},
];
const active = ref(-1);
const handleTabMenuClick = (
visible: boolean,
ctx: PopupVisibleChangeContext,
path: number
) => {
if (ctx.trigger === "document") active.value = -1;
if (visible) active.value = path;
};
</script>
期望结果
正常显示下拉框
实际结果
错误提示:cannot read properties of null (reading 'refs')
框架版本
3.4.x
浏览器版本
122.0.6261.70
系统版本
Windows(22H2)
Node版本
20.9.0
补充说明
No response
👋 @XiaoYuJuQiang,感谢给 TDesign 提出了 issue。 请根据 issue 模版确保背景信息的完善,我们将调查并尽快回复你。
解决了吗?
还没解决吗