ant-design-vue icon indicating copy to clipboard operation
ant-design-vue copied to clipboard

menu组件items参数使用computed计算属性且label参数值为VNode时出现很多错误

Open catpigdog opened this issue 2 years ago • 12 comments
trafficstars

  • [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Version

4.0.0-rc.6

Environment

vue3

Reproduction link

https://github.com/catpigdog/bug-antdforvue-menu

Steps to reproduce

使用Menu时 items参数传入一个computed返回值ItemType,且ItemType的label属性值为VNode时 menu会出现样式错乱,openKeys selectedKeys 参数没作用, inline-collapsed 参数改变时报错

What is expected?

正确渲染

What is actually happening?

报错 渲染错乱


ItemType['label'] VueNode 能改为 VueNode | ()=>VueNode 就很棒

catpigdog avatar Aug 18 '23 14:08 catpigdog

Hello @catpigdog. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to proper branch, fill the Pull Request Template here, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @catpigdog,我们完全同意你的提议/反馈,欢迎直接在此仓库创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到正确的分支,务必填写 Pull Request 内的预设模板,提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等,并确保 CI 通过,我们会尽快进行 Review,提前感谢和期待您的贡献。

github-actions[bot] avatar Aug 21 '23 01:08 github-actions[bot]

@catpigdog openKeys selectedKeys 参数没作用,是因为你没有给 key 值吧,看了一眼你仓库。其他地方你要不再仔细描述一下?[😛]

kovsu avatar Aug 23 '23 00:08 kovsu

@catpigdogopenKeys selectedKeys 参数没作用,是因为你没有给 key 值吧,赶紧查看一下你的仓库。其他地方你要不再仔细描述一下吗?[😛] 抱歉,key字段写成了name字段,仓库代码已更新。但是这个问题依然是存在的

catpigdog avatar Aug 24 '23 14:08 catpigdog

icon和我这个问题无关,主要是由label传入Vnode后,且由vue computed计算属性返回就会出现布局错乱问题: 以下是传入items内容后,更新inlineCollapsed参数或者点击该菜单 item1时 就会出现布局错乱,在该菜单位置多生成一个menu

const items = computed(() => [
  {
    key: 'sub1',
    icon: () => h(SettingOutlined),
    label: 'Navigation Three - Submenu',
    title: 'Navigation Three - Submenu',
    children: [
      {
        type: 'group',
        label: 'Item 1',
        children: [
          {
            label: h(AppstoreOutlined),
            title: 'setting:1',
            key: 'setting:1',
          },
          {
            label: 'Option 2',
            key: 'setting:2',
          },
        ],
      }
    ],
  }
]);

bug

@kovsu

catpigdog avatar Aug 25 '23 04:08 catpigdog

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

github-actions[bot] avatar Nov 05 '23 02:11 github-actions[bot]

Not stale

greenhat616 avatar Nov 05 '23 10:11 greenhat616

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

github-actions[bot] avatar Jan 05 '24 02:01 github-actions[bot]

not stale

greenhat616 avatar Jan 05 '24 03:01 greenhat616

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

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

not stale

greenhat616 avatar Mar 07 '24 02:03 greenhat616

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

github-actions[bot] avatar May 07 '24 02:05 github-actions[bot]

not stale

greenhat616 avatar May 07 '24 08:05 greenhat616

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

github-actions[bot] avatar Jul 07 '24 02:07 github-actions[bot]