[Space] children items with v-if and v-show rerender on every toggle

[Meowu]

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

Version

3.3.0-beta.4

Environment

Vue 3.2.36

Reproduction link

Steps to reproduce

open the sandbox:

1. click Toggle button
2. check the console
3. TestA and TestB always rerender on every toggle, although they are used with v-show

What is expected?

Children components of Space do not rerender on every toggle.

What is actually happening?

Children components with v-show always rerender, so they will lost their internal state.

This only happens when the children have both v-if and v-show. The children with v-show should not rerender.

---

I explored the source code, and found that if I change

const items = filterEmpty(slots.default?.());

to

const items = slots.default?.() ，

the problem disappeared.

But I don't think this is the reason.

[CCherry07]

我来看看

[CCherry07]

目前你可以试着，将v-show 所控制的组件，往前移，在v-if 之前

    <a-space>
      <TestA v-show="show === 'A'" />
      <TestB v-show="show === 'B'" />
      <div v-if="show === 'B'">show B</div>
    </a-space>

[Meowu]

目前你可以试着，将v-show 所控制的组件，往前移，在v-if 之前

    <a-space>
      <TestA v-show="show === 'A'" />
      <TestB v-show="show === 'B'" />
      <div v-if="show === 'B'">show B</div>
    </a-space>

hhh 我有发现这个 workaround 。

并且如何把 child 外面的 div 去掉，也能解决问题，但是无法确定到底是什么造成的。

我也测试了其他组件库，不存在这个问题。有点神奇。

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.