Reactjs 反应路由器:如何在OneNet处理程序中获取上一条路由?
我试图找到一种方法,当用户在Reactjs 反应路由器:如何在OneNet处理程序中获取上一条路由?,reactjs,react-router,react-router-redux,Reactjs,React Router,React Router Redux,我试图找到一种方法,当用户在onEnter处理程序中点击一个新的路由/路径时,读取以前的路由/路径 我有一个结构如下的反应路由器: <Router history={history}> <div className="index"> <Route path="/" component={ComposedAppComponent} onEnter={this.onEnter
onEnter
处理程序中点击一个新的路由/路径时,读取以前的路由/路径
我有一个结构如下的反应路由器:
<Router history={history}>
<div className="index">
<Route
path="/"
component={ComposedAppComponent}
onEnter={this.onEnterHandler.bind(this)}
>
<Route name="streamKey" path=":streamKey">
<Route name="articleUri" path="(**)" />
</Route>
</Route>
</div>
</Router>
我似乎找不到一种方法来读取用户所在的上一个路由路径。。。我需要把新路线和以前的路线做一个比较。非常感谢您对如何实现这一目标的任何意见。:)
干杯 当用户通过地址栏导航到新路径时,或者使用类似于
this.context.router.push()
的react router时,您是否试图获取上一个路径
如果导航使用的是react router
,也许以下简单方法可以满足您的需求:
1。使用查询参数传递prevPath
导航可能如下所示:
`<Link to="/next" query={{ prevPath: this.props.location.pathname }}> Your Next path</Link>`
`<Link to="/next" state={{ prevPath: this.props.location.pathname }}> Your Next path</Link>`
现在,您可以使用以下方法获取onEnterHandler
方法上的prevPath值:
nextState.location.state.prevPath
- Cons:查询不会出现在地址栏上
- Pros:当用户通过地址栏导航(直接路径访问)时,您无法获取您的
prevPath
此外,这些方法的缺点是您应该为每个链接组件分配一个
prevPath
值。为链接组件创建包装器组件将解决此问题。非常确定第二个参数是最后一个状态。yupOh我的错误,但是onChange
下面的函数似乎正是您想要的for@azium谢谢你的提示,但我认为这行不通。当一个用户进入一条路线时,我需要触发这个。哦。。。那就把这个怎么样?我刚刚试过,我得到了上一条(当前)路径!链接
组件的包装器是什么样子的?我是一个反应新手,所以如果这是一个新手问题,我道歉@米尔扎。adipradhana@JayS. 您将创建一个HOC(高阶组件)-我们称之为
。在它里面你会有一个普通的
,但是你会把查询
/状态
属性传递给它。然后,无论何时使用
而不是
,您都不需要指定查询
/状态
,因为您创建的包装器将自动为您传递它。
`<Link to="/next" state={{ prevPath: this.props.location.pathname }}> Your Next path</Link>`