React Router 组件在路由更改时卸载

Question

我使用 React + Redux 创建了一个 SPA，我在其中使用了 react-route。我面临一个问题，每当我切换我的路线时，如 /about、/contact、/list..每次组件都被卸载。

所以，我需要知道这是预期的行为还是我做错了什么。因为在某些组件中，我正在调用 ajax 来获取数据，如果组件被卸载并且用户再次回来......即使数据已经在商店中可用，它也会再次调用 ajax。

<Route path="/" component={App}>
    <IndexRoute component={HomePage} />
    <Route path="about" component={About} />
    <Route path="/" component={HomePage} />
</Route>

Answer 1

每次导航到一个路由时，旧组件被删除，新组件被加载并填充存储值（使用 redux 的连接）。

数据将始终在存储中可用，因此当组件卸载并再次重新加载时，您无需触发新的 ajax 请求。

而且，如果您仍然希望组件始终可用，那么您可以使用单个路由并使用导航菜单或选项卡在主组件中显示和隐藏组件......但是根据组件的数量，DOM 可以变得漂亮重的。