Comments (20)
1.引入进来提示invariant未安装 需要手动安装
2.安装完后跑起来没有报错 但也没有缓存路由
感谢您的宝贵意见,第一个问题已经解决,会发布新版本 , 第二个问题 我想问一下外层是否没有 KeepliveRouterSwitch 包裹呢,如果有的话 ,可以复制一下代码。
from react-keepalive-router.
from react-keepalive-router.
1.引入进来提示invariant未安装 需要手动安装
2.安装完后跑起来没有报错 但也没有缓存路由
您好,这个问题已经修复,1.0.7+
版本已经发布 , 原因就是跨层级route
问题 ,上一个版本没有处理,另外 KeepliveRouterSwitch
改名为 KeepaliveRouterSwitch
KeepliveRoute
改名为 KeepaliveRoute
为了方便您使用,我根据你的代码写了一个demo
,供参考
import { KeepaliveRouterSwitch ,KeepaliveRoute } from 'react-keepalive-router'
const RouteWithSubRoutes = (item)=> <div style={{ background:'pink' }} > <KeepaliveRoute path={item.path} component={ item.component } ></KeepaliveRoute> </div>
const index = () => {
return <div >
<div >
<Router >
<Meuns/>
<KeepaliveRouterSwitch>
{
[{ path:'/detail' ,component:Detail }].map(item=> <RouteWithSubRoutes key={item.path} {...item} />)
}
<Route path={'/index'} component={Index} ></Route>
<Route path={'/list'} component={List} ></Route>
{/* 路由不匹配,重定向到/index */}
<Redirect from='/*' to='/index' />
</KeepaliveRouterSwitch>
</Router>
</div>
</div>
}
from react-keepalive-router.
组件内部传入的属性props 不再具有props.history功能 请问怎么跳转呢
from react-keepalive-router.
组件内部传入的属性props 不再具有props.history功能 请问怎么跳转呢
现在可以用 react-router-dom
的 withRouter
包裹组件解决这个问题。react-keepalive-router
内部也引用了react-router-dom
依赖, 稍后我会处理这个问题,感谢您的宝贵问题🙏🙏🙏。demo奉上
import { withRouter } from 'react-router-dom'
function index(props) {
console.log(props)
return <div>
demo
</div>
}
export default withRouter(index)
from react-keepalive-router.
厉害 现在整个流程可以走通了 如果后续发现问题也会及时反馈 非常感谢
from react-keepalive-router.
厉害 现在整个流程可以走通了 如果后续发现问题也会及时反馈 非常感谢
好的 ,非常感谢您的及时反馈,这个项目,刚开始做,后续会完善功能,后续功能从页面到组件,你们的反馈是我前进方向与动力🙏🙏🙏。一起加油,一起努力❤️❤️❤️
from react-keepalive-router.
a页面跳到b页面 a.b页面都缓存了 并且在进入页面时都打印了props 当在b返回a时做清除b页面操作
回到a页面 props打印出来cacheState确实清除了b页面信息 但是同时也打印了b页面的props 并且b页面的cacheState里有a.b两个页面信息 b页面还是缓存着在 麻烦看一下 版本1.0.7
from react-keepalive-router.
a页面跳到b页面 a.b页面都缓存了 并且在进入页面时都打印了props 当在b返回a时做清除b页面操作
回到a页面 props打印出来cacheState确实清除了b页面信息 但是同时也打印了b页面的props 并且b页面的cacheState里有a.b两个页面信息 b页面还是缓存着在 麻烦看一下 版本1.0.7
您好,react-keepalive-router
有一个缓存周期,目的就是在后续加入组件/页面缓存生命周期使用,当调用 清除方法的时候,只是加了销毁状态,但是此时页面并没有销毁,销毁是再下一次进入destory页面的时候销毁之前的状态,这样做当初是为了避免在路由跳转时候,触发销毁功能,导致一次不必要重复的渲染,但是这样做也确实造成了一些副作用,我会尽快解决这个问题。
修复后 ,我会第一时间通知您。
from react-keepalive-router.
好的 非常感谢
from react-keepalive-router.
好的 非常感谢
hello,您好,发布1.0.9
版本,解决了之前留下的两个问题:
1 嵌套路由 , histoy ,location
对象丢失问题。
2 当调用销毁状态后,cacheState
保留问题,为了防止篡改cacheState
, cacheState
不对外暴露。
感谢您的支持~~~
from react-keepalive-router.
您好
1.最新版本调用销毁,并没有销毁掉 ,销毁方法的唯一标识是路由path吗 如果是调用全部销毁方法,第一次会清掉,后面重复切换页面还是会缓存下来呢
2.两个竖直方向滚动可以向下加载的列表页面,当其中一个页面向下滚动加载时,会触发另外一个页面的向下加载请求?
麻烦有时间看一下 感谢
from react-keepalive-router.
您好
1.最新版本调用销毁,并没有销毁掉 ,销毁方法的唯一标识是路由path吗 如果是调用全部销毁方法,第一次会清掉,后面重复切换页面还是会缓存下来呢
2.两个竖直方向滚动可以向下加载的列表页面,当其中一个页面向下滚动加载时,会触发另外一个页面的向下加载请求?
麻烦有时间看一下 感谢
hello ,您好 , 我这就看,感谢您的反馈 ,第一时间通知,这边您方便提供一下 销毁缓存的代码吗
from react-keepalive-router.
from react-keepalive-router.
您好
1.最新版本调用销毁,并没有销毁掉 ,销毁方法的唯一标识是路由path吗 如果是调用全部销毁方法,第一次会清掉,后面重复切换页面还是会缓存下来呢
2.两个竖直方向滚动可以向下加载的列表页面,当其中一个页面向下滚动加载时,会触发另外一个页面的向下加载请求?
麻烦有时间看一下 感谢
好的 我这边尽快处理问题 ,第一时间通知您
from react-keepalive-router.
好的
from react-keepalive-router.
好的
您好,最近有点忙让您久等了,react-keepalive-router
发布1.1.0
版本了,修复的问题有
1 用 prop.cacheDispatch
缓存路由失败问题。滚动问题(还需要进行大量测试)。
2 跨层级路由,路由匹配问题。
3 switch
组件中加入了key
,防止diff
过程中,组件被缓存,切换页面,无法正常跳转问题
from react-keepalive-router.
cacheId在哪里定义的,reademe里面没看到啊,还是就是字符串'cacheId'啊
from react-keepalive-router.
cacheId在哪里定义的,reademe里面没看到啊,还是就是字符串'cacheId'啊
您好,cacheId
就是在 keepliveRoute
标签中定义,作为整个 缓存状态的 key
,如果没有,会默认选择 path
路由路径作为key
,稍后我会详细更新 reademe
from react-keepalive-router.
cacheId在哪里定义的,reademe里面没看到啊,还是就是字符串'cacheId'啊
from react-keepalive-router.
Related Issues (17)
- 这个真好,希望能一起贡献
- 动态路由变化动态参数后,没有重新请求 HOT 1
- 如何实现后退缓存,前进或者平级路由清除缓存 HOT 1
- 路由的exact属性无效
- Cannot read properties of undefined (reading 'state') HOT 1
- 用react 18的import ReactDOM from 'react-dom/client' ReactDOM.createRoot 会报错,请问有解决方案?
- scroll设置不生效
- addKeeperListener 触发多次
- 问题太多了啊,没法用。。
- Attempted import error: '__RouterContext' is not exported from 'react-router-dom'. HOT 2
- 建议 HOT 5
- 提供完整的 demo HOT 3
- useCacheDispatch这个有类组件的方法么? HOT 1
- useParams无效
- 你好,hooks里面怎么使用周期 HOT 1
- 函数组件中页面表现与react的实际状态不一致 HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-keepalive-router.