a-menu property `key` conflict with vue

[wvq]

trafficstars

• [ ] 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

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

[tangjinzhou]

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

[williamsxu]

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

<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 ）

[JobinJia]

Maybe you can use v-bind="{ key: route.key }" resolve it.