When a CollapseItem is not rendered, its expanded status gets lost when other items get expanded/collapsed

[ouuan]

TuSimple/naive-ui version (版本)

2.19.8

Vue version (Vue 版本)

3.2.20

Browser and its version (浏览器及其版本)

Mozilla Firefox 93.0

System and its version (系统及其版本)

Arch Linux 5.14.12-zen1-1-zen

Node version (Node 版本)

v16.11.1

Reappearance link (重现链接)

https://codesandbox.io/s/default-expanded-names-v-if-c43b2?file=/src/App.vue

Reappearance steps (重现步骤)

1. Show C, C is expanded
2. Hide C
3. Expand B
4. Show C, C is collapsed
5. Hide B
6. Show B, B is expanded
7. Hide B
8. Collapse A
9. Show B, B is collapsed

Expected results (期望的结果)

While a CollapseItem is not rendered, its expanded status keeps unchanged.

Actual results (实际的结果)

When a CollapseItem is not rendered, its expanded status gets lost when other items get expanded/collapsed.

Remarks (补充说明)

This can also cause the default-expanded-names prop to fail if a default-expanded item is rendered after other items get toggled.

A workaround is to use v-show for CollapseItem itself (not the display-directive prop) and wrap the inner contents with <template v-if>.

[07akioni]

This's actually a feature but I find it's not good.

Collapse will sanitize value before it emit the value. If there's no corresponding value in the collapse, the value will be removed.

I'll change the behavior.

[9mm]

@07akioni how come default-expanded-names is not reactive? If its empty to start, and then gets filled in (from an API call) it doesnt open them

[ymkiux]

@07akioni怎么default-expanded-names没有反应？如果它一开始是空的，然后被填充（通过API调用）它不会打开它们
可以通过v-if变量值，预设所有可能存在的n-collapse default-expanded-names，通过watch或者其他监听变化更改变量值状态即可，如果你非要使用这个组件来实现功能的话