连接和withRouter问题

Question

我正在为我的项目使用Redux和React。我在App.js中有一些路由。我还在项目的react-redux中使用connect函数。为了防止更新阻止问题，我通常以这种方式包装组件

withRouter(connect(mapStateToProps, mapDispatchToProps)(App)),

但是，如果我更改了withRouter的顺序并连接它不起作用：

connect(mapStateToProps, mapDispatchToProps)(withRouter(App))

我在App.js中有console.log道具。它已经收到位置和历史道具。我正在弄清楚顺序为什么重要的背后的理论？

Answer 1

您可以将其与composeredux库中的方法一起使用。

export default compose(
  withRouter,
  connect(mapStateToProps, mapDispatchToProps)
)(App);

Answer 2

你能参考这个https://reacttraining.com/react-router/core/api/withRouter，它清楚地表明它不能反过来工作

Answer 3

你可以通过两种方式做到这一点

合适的方式：

withRouter(connect(mapStateToProps, mapDispatchToAction)(App));

有了这个，您将能够在 mapStateToProps 中获得 withRouter 道具，如历史记录、匹配等。

方式二：

connect(mapStateToProps, mapDispatchToAction)(withRouter(App));

使用这个，你将无法获得 withRouter 道具

Answer 4

如果有人仍然有问题，那么请按照这个

const ShowTheLocationWithRouter = withRouter(Login);

export default connect(mapStateToProps, mapDispatchToProps)(ShowTheLocationWithRouter);