tdesign-vue-next icon indicating copy to clipboard operation
tdesign-vue-next copied to clipboard

[dropdown] 生产模式下,在vue3.4.x,tabs→tab-panel→组件中使用dropdown报错

Open YahaneXy opened this issue 1 year ago • 3 comments

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

YahaneXy avatar Mar 07 '24 05:03 YahaneXy

👋 @XiaoYuJuQiang,感谢给 TDesign 提出了 issue。 请根据 issue 模版确保背景信息的完善,我们将调查并尽快回复你。

github-actions[bot] avatar Mar 07 '24 05:03 github-actions[bot]

解决了吗?

hdszy avatar Apr 15 '24 10:04 hdszy

还没解决吗

jesseice avatar Jul 26 '24 09:07 jesseice