const PATH = BASE + '/' + id;
<Route path="PATH" render={PageContainer} /> (DOESN'T WORK for the case below)
<Route path="PATH" component={PageContainer} /> (DOESN'T WORK for the case below)
<Route path="PATH" component={ () => <PageContainer /> } /> (WORKS)
Steps:
1) go to the page BASE/1
2) go back to BASE
3) go to BASE/2
PageContainer connects to the store and passes props to Page.
为什么第二种方法有效,而第一种方法不行?
Update: <Route path="PATH" render={PageContainer} /> (DOESN'T WORK for the case below)
尝试像这样访问它:
<Route path="PATH" component={PageContainer} />
组件和渲染道具之间存在差异。您可以在这里找到答案: react router 组件和渲染之间的区别
render — 返回 React 元素的函数。当路径匹配时它将被调用。这与组件类似,但对于内联渲染和向元素传递额外的属性很有用。
PageContainer 是一个组件,所以应该被调用,但不像 PageContainer
改变
<Route path="PATH" render={PageContainer} />
至
<Route path="PATH" render={<PageContainer />} />
在你的情况下,我建议你使用组件道具而不是渲染
<Route path="PATH" component={<PageContainer />} />