let <Keep-Alive> :include can recognize the `key` attribute of its children
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