Features Request Board

[finedaybreak]

[finedaybreak]

I am planning to add a cache auto-expire feature

function Layout(){
  return (<KeepAlive maxAliveTime={"20s"}>
        {/*....*/}
  </KeepAlive>)
}

function Layout(){
  return (<KeepAlive maxAliveTime={{
   "admin/dashboard":"20s"
  }}>
        {/*....*/}
  </KeepAlive>)
}

[noru]

Any plan to support react-router v7?

[finedaybreak]

Any plan to support react-router v7?

Yes, I am actively working on adding support for React Router v7 and plan to release it soon.

[noru]

Would you please make activeCacheKey optional instead of omit?

export interface KeepAliveRouteOutletProps extends Omit<KeepAliveProps, "activeCacheKey">

In my case, I have nested routes and I need to cache the outter outlet with more general name. If not, both outlet would have the active/inactive state change and break the transition.

// url: /:parent/:child?foo=bar
<KeepAliveRouteOutlet activeCacheKey={parent_path}>  // cache by /:parent
    <KeepAliveRouteOutlet />  // cache as usual
</KeepAliveRouteOutlet>

[finedaybreak]

Would you please make activeCacheKey optional instead of omit?

export interface KeepAliveRouteOutletProps extends Omit<KeepAliveProps, "activeCacheKey">

In my case, I have nested routes and I need to cache the outter outlet with more general name. If not, both outlet would have the active/inactive state change and break the transition.

// url: /:parent/:child?foo=bar

<KeepAliveRouteOutlet activeCacheKey={parent_path}>  // cache by /:parent

    <KeepAliveRouteOutlet />  // cache as usual

</KeepAliveRouteOutlet>

keepalive should be used on top level once and subpages' layout use Outlet imported from react-router-dom

https://github.com/irychen/super-admin/blob/main/src/pages/admin/nested/index.tsx

[noru]

keepalive should be used on top level once and subpages' layout use Outlet imported from react-router-dom

Then I have 2 questions:

1. Does that mean the subpages' Outlets are NOT keeped alive?
2. If so, does that mean this lib only supports top level keepalive (& transition)?

Thanks for answering

[finedaybreak]

keepalive should be used on top level once and subpages' layout use Outlet imported from react-router-dom

Then I have 2 questions:

1. Does that mean the subpages' Outlets are NOT keeped alive?

2. If so, does that mean this lib only supports top level keepalive (& transition)?

Thanks for answering

They are cached together and have holistic transition, you can visit the demo website https://super-admin.tech/#/admin/nested/nested-1/nested-1-1

[noru]

They are cached together and have holistic transition

Well, that's excatly my problem. The parent route should not be flickering with the child route.

My solution is to use <KeepAlive activeCacheKey={parentPath}/> to hold parent outlet and <KeepAliveRouteOutlet /> inside. The only thing I did is to gain fine-grain control over theactiveCacheKey instead of asserted location.path+location.search. And I did not see any nagetive impact on <KeepAliveRouteOutlet />side (to take it as an optional prop), from my point of view.

To me the KeepAliveRouteOutlet is a syntax sugar over the KeepAlive. I understand that it may be your design decision as a top-level wrapper, but it would be great for taking it into consideration.

[finedaybreak]

They are cached together and have holistic transition

Well, that's excatly my problem. The parent route should not be flickering with the child route.

My solution is to use <KeepAlive activeCacheKey={parentPath}/> to hold parent outlet and <KeepAliveRouteOutlet /> inside. The only thing I did is to gain fine-grain control over theactiveCacheKey instead of asserted location.path+location.search. And I did not see any nagetive impact on <KeepAliveRouteOutlet />side (to take it as an optional prop), from my point of view.

To me the KeepAliveRouteOutlet is a syntax sugar over the KeepAlive. I understand that it may be your design decision as a top-level wrapper, but it would be great for taking it into consideration.

Great, I will make this feature released in the next version.

[caofuchang]

您好，请问未来会考虑“记住滚动条位置”这个功能吗？

How to restore the scrollbar to its previous position #17 未保存滚动条位置，如果table有虚拟滚动的话，会导致数据空白 #12

issues17和issues12，我都看了。对于简单页面或者只有一个滚动条的页面，上述方法确实可用。

我的项目里，页面比较多，也比较复杂。单个页面里可能有2个、3个、甚至多个滚动条。如果每个有滚动条的地方都用MemoScrollTopWrapper包裹一层的话，项目的代码改动量会很大。 如果keepalive-for-react本身支持记住滚动条位置，我项目里的子页面就无需改动，只改路由和顶层的几个根组件即可。

所以我想问一下，keepalive-for-react，未来会考虑增加“记住滚动条位置”这个功能吗？

[finedaybreak]

您好，请问未来会考虑“记住滚动条位置”这个功能吗？

How to restore the scrollbar to its previous position #17 未保存滚动条位置，如果table有虚拟滚动的话，会导致数据空白 #12

issues17和issues12，我都看了。对于简单页面或者只有一个滚动条的页面，上述方法确实可用。

我的项目里，页面比较多，也比较复杂。单个页面里可能有2个、3个、甚至多个滚动条。如果每个有滚动条的地方都用MemoScrollTopWrapper包裹一层的话，项目的代码改动量会很大。 如果keepalive-for-react本身支持记住滚动条位置，我项目里的子页面就无需改动，只改路由和顶层的几个根组件即可。

所以我想问一下，keepalive-for-react，未来会考虑增加“记住滚动条位置”这个功能吗？

用hook侵入性比较小一点、推荐使用hook。至于缓存住所有滚动条，这个问题暂时还没思路

[brandonxiang]

这个库和 react router viewTransition api 存在冲突?

忽略，好像把 transition 参数去掉，就行了

[jinxiangqiang]

可以考虑兼容umi4吗？开启qiankun加载子应用无法正常工作

[finedaybreak]

想把基于react context参数传递的方式换掉，有没有什么好的想法，目前感觉context有点浪费性能

[finedaybreak]

可以考虑兼容umi4吗？开启qiankun加载子应用无法正常工作

你可以选择组件内部缓存，不使用基于路由的方式，路由级别缓存嘛umi4多多少少有点问题