slot v-if overwrite

[ShanZiJun]

Vue version

3.1.0

Link to minimal reproduction

https://stackblitz.com/edit/vue-3-composition-api-demo-vaedev?file=src%2FApp.vue,package.json

Steps to reproduce

涉及到slot的时候
外面的slot内容延迟渲染，就会导致无法覆盖slot内部的默认内容
v-if="showOutBtn"

What is expected?

外面的slot内容覆盖slot的默认内容

What is actually happening?

System Info

No response

Any additional comments?

No response

[jh-leong]

As a workaround, add a unique key to the slot content:

<button v-if="showOutBtn" @click="triggerOutBtn('showOutBtn')" key="uniqueKey">
  内部slot带if，相同类型元素
</button>

For the complete code, see this playground

The issue occurs because the slot content and fallback content have the same key (the default key for v-if vnode is 0) and vnode type (div), causing patching problems.

a minimal reproduction

[jh-leong]

It looks like this issue will be fixed in #9213

[edison1105]

Thanks @jh-leong
closing as duplicate of #7256