当反应路由器重新安装它时，反应组件不会改变状态

Question

我有渲染不同组件的反应路由器。它看起来像这样：

ReactDOM.render(
        <Provider store={store}>
                <Router>
                        <div>
                                <Route exact path="/" component={ListPage}/>
                                <Route path="/edit/:itemId" component={ItemPage}/>
                        </div>
                </Router>
        </Provider>,
        document.getElementById('root')
);

所以 - 当我打开编辑页面时 - 组件呈现并在安装时我正在获取该项目的数据。我将其设置为状态，因此组件呈现。

然后 - 我回到列表页面并打开另一个项目的编辑页面 - 当编辑页面再次挂载时 - 它的状态与以前相同。

为什么会这样？每次路由器挂载时，编辑页面不应该以默认状态重新开始吗？

（目前我正在通过重置componentDidMount() 上的状态来解决此问题，但它对我来说看起来很丑陋的解决方案。）

Answer 1

这应该可以解决您的问题。

ReactDOM.render(
      <Provider store={store}>
        <Router>
          <Switch>
            <Route exact path="/" component={ListPage}/>
            <Route path="/edit/:itemId" component={ItemPage}/>
          </Switch>
        </Router>
      </Provider>,
   document.getElementById('root')
);