我正在将SSR与react-router和Redux一起使用。除非我打开/
页面,然后单击<Link to="/sign" />
,然后页面并查看对/sign
的更改,否则所有内容均正常运行。然后,当我按浏览器中的“后退”按钮(现在我将位于/
上)之后,单击<Link to="/sign" />
,仅URL更改,仅此而已。该组件仍与/
相同,但应为/
。
在服务器上,我这样渲染:
renderToString(
<Loadable.Capture report={m => modules.push(
<Provider store={store}>
<StaticRouter location={req.url} context={context}>
<Frontload isServer>
<Navigation />
</Frontload>
</StaticRouter>
</Provider>
</Loadable.Capture>
)
还有我的导航组件:
<Router history={createStore().history}>
<Switch>
{publicRoutes.map(
({ path, DefaultComponent, AuthComponent }) => (
<Route
path={path}
exact
render={() =>
authenticated ? (
<AuthComponent />
) : (
<DefaultComponent />
)
}
/>
)
)}
<Route render={() => <Redirect to="/" />} />
</Switch>
</Router>
createStore 函数获取Redux store
和history
的创建方式,例如:createMemoryHistory({initialEntries: [req.url]})
。