Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

a-menu property key conflict with vue #5540

Open
1 task
wvq opened this issue Apr 23, 2022 · 2 comments
Open
1 task

a-menu property key conflict with vue #5540

wvq opened this issue Apr 23, 2022 · 2 comments

Comments

@wvq
Copy link

wvq commented Apr 23, 2022

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

Version

3.2.0

Environment

antdv 3.2.0, vue 3.2.33

Reproduction link

Edit on CodeSandbox

Steps to reproduce

menu中使用key做为唯一值,但是vue template for循环的时候,也是需要key,这就导致 if else 的情况下冲突了

<a-menu mode="inline">
  <template v-for="route in routes">
    <a-sub-menu v-if="route.children" :key="route.key"></a-sub-menu>
    <a-menu-item v-else :key="route.key"></a-menu-item>
  </template>
</a-menu>

这种写法下, vue提示错误: v-if/else branches must use unique keys.vue(29).
写法上有办法规避,但是确实不建议用key这种关键字做prop

What is expected?

no errors

What is actually happening?

error: v-if/else branches must use unique keys

@github-actions github-actions bot changed the title a-menu property key conflict with vue a-menu property key conflict with vue Apr 23, 2022
@tangjinzhou
Copy link
Member

历史债务,改成其他的话,破坏性比较大

@williamsxu
Copy link

实际使用其实应该这样写:

<a-menu mode="inline">
  <template v-for="route in routes">
    <a-sub-menu v-if="route.children" >
         <a-menu-item  v-for="subMenuItem in route.children" :key="subMenuItem.key"></a-menu-item>
    </a-sub-menu>
    <a-menu-item v-else :key="route.key"></a-menu-item>
  </template>
</a-menu>

本身sub-menu 不需要 key ,而是每个menu item 需要 key(当前使用的版本为4.0.0 )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants