[Feature Request] Collapse 支持当前被展开项目在动画结束前都保持在视口内

[luwuer]

What problem does this feature solve?

问题：Collapse 设置 accordion 属性，当展开内容有一定高度时，下一个展开项目在展开时可能因为滚动条变化而看不见任何内容，需要手动移动滚动条才能看到展开内容。

复现示例：https://codesandbox.io/p/sandbox/vant-issue-mo-ban-forked-zndg8k?file=%2Fsrc%2FApp.vue&layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522cluwcsbhd00073a6jtyvtjrvw%2522%252C%2522sizes%2522%253A%255B100%252C0%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522cluwcsbhd00033a6jvble36nd%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522cluwcsbhd00043a6jf982yjct%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522cluwcsbhd00063a6jf734vlry%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522cluwcsbhd00033a6jvble36nd%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522cluwcsbhd00023a6jq9nazv7i%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fsrc%252FApp.vue%2522%257D%255D%252C%2522id%2522%253A%2522cluwcsbhd00033a6jvble36nd%2522%252C%2522activeTabId%2522%253A%2522cluwcsbhd00023a6jq9nazv7i%2522%257D%252C%2522cluwcsbhd00063a6jf734vlry%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522cluwcsbhd00053a6jk926kov1%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522id%2522%253A%2522cluwcsbhd00063a6jf734vlry%2522%252C%2522activeTabId%2522%253A%2522cluwcsbhd00053a6jk926kov1%2522%257D%252C%2522cluwcsbhd00043a6jf982yjct%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522cluwcsbhd00043a6jf982yjct%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Afalse%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

问题展示，视频（新展开项目 ——标题 1 ，消失在视口）：

2024-04-12.15.41.28.mov

预期实现：

2024-04-12.15.55.30.mov

补充说明：

1. 由于滚动机制优化差异，在 Safari 上这个问题严重得多。核心差异在于折叠内容在 Chrome 上不可见时，视图内的节点不会有位置变化，而 Safari 上原原本本的反应折叠内容的高度丢失，从而当前展开内容会因为上方内容高度丢失过多而完全消失在视口内。

What does the proposed API look like?

CollapseItem 新增属性 expandInViewport ，默认 false，设置为 true 时表示展开内容需要呆在视口内，不会因为折叠项高度消失导致展开内容被滚动到视口外。

<van-collapse accordion>
  <van-collapse-item expand-in-viewport></van-collapse-item>
</van-collapse>

[luwuer]

确认接纳这个功能后，我可以提供 PR 实现相应逻辑（Vue2、Vue3）

[github-actions]

Hello @luwuer. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to main branch, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @luwuer，我们完全同意你的提议/反馈，欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到 main 分支，提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待你的贡献。

[chenjiahan]

如果实现不复杂的话，可以提供一个 props 来支持，欢迎 PR~

[luwuer]

如果实现不复杂的话，可以提供一个 props 来支持，欢迎 PR~

test 目录下的快照文件是 CI 自动更新的吗？