-
-
Notifications
You must be signed in to change notification settings - Fork 8.8k
Description
What problem does this feature solve?
此提议允许 KeepAlive 根据组件的 key
主动地舍弃某些已经不需要被缓存的节点。
This proposal allows KeepAlive to actively discard some nodes that no longer need to be cached based on the component's `key'.
我有一个组件,在KeepAlive下将其 key
属性设置为 route.fullPath
,就可以根据路由参数的不同显示出不同的页面,于此同时都可以被KeepAlive缓存,但是如果同时缓存的页面过多,会导致性能下降。所以我本来打算设置include属性来控制显示哪些key,这样就可以让 KeepAlive 选择性地丢弃某些已经被缓存的组件(通过动态修改 include数组的方式),但是 KeepAlive 好像并不支持对 key 属性的识别(根据文档的描述,默认使用 name 属性来识别组件)?
I have a component that sets its key
property to route.fullPath
under KeepAlive to show different pages depending on the different routing parameters, and can be cached at the same time, but if too many pages are cached at the same time, performance will be degraded. So I was going to set the include property to control which keys are displayed so that KeepAlive can selectively discard some cached components (by dynamically modifying the include array), but KeepAlive doesn't seem to support the identification of key
properties (by default, the name
property is used to identify components as described in the document)?
What does the proposed API look like?
<router-view v-slot="{ Component }">
<keep-alive :include_key=["fullPathA", "fullPathB"]>
<component :key="$route.fullPath" :is="Component" />
</keep-alive>
</router-view>
Later, we can dynamically modify include_ key
array to control which components need to be cached
Activity
majoson-chen commentedon Mar 21, 2023
#7930
KaygNas commentedon Apr 14, 2023
I need this feature too, try finding way out but it turns out there is not.
sunxi1997 commentedon May 10, 2023
如果 pruneCacheEntry 可以直接 expose 出来, 外部调用是不是更好?
tomina1 commentedon Jan 18, 2024
You can achieve manual operation by wrapping the Component function, reading the corresponding type attribute, assembling the name based on the ID, and then using h to rebuild the vnode and cache it, combined with the include attribute
AndreBooysen commentedon May 15, 2024
please implement something to remove cached components via key. In my scenario I open dashboards (example /dashboard/:id) in different tabs. The users need to be able to tab between the dashboards without having to reload them (dashboards keeping their state). Everything works great except being able to remove the component from the Keep-alive cache when a tab is closed.
LIUSHUAI2018 commentedon Aug 13, 2024
我也需要这样的功能
aiqin-bao commentedon Aug 16, 2024
Is it possible to use path instead of fullPath? because fullPath has query params