在哪里放 withRouter 反应答案

【问题标题】：Where to put withRouter in react在哪里放 withRouter 反应
【发布时间】：2019-06-19 13:57:22
【问题描述】：

在我的应用程序中，我将 redux 部分与 react 组件分开。现在我很困惑，将 withRouter() 放在哪里。它适用于组件和容器，但是好的做法是什么？

这是我的代码。

import { connect } from 'react-redux';
import { withRouter } from 'react-router-dom'; 
import {bindActionCreators} from 'redux';

import RegisterScreen from './RegisterScreen';
import { registerUser } from '../../../actions';

const mapStateToProps = state => ({
   auth: state.auth,
   errors: state.errors
});

const mapDispatchToProps = dispatch => ({
   registerUser: bindActionCreators(registerUser, dispatch)
});

export default connect(mapStateToProps, mapDispatchToProps)(withRouter(RegisterScreen));

在这里，如果我们导出 like, this 并在组件中设置 withRouter，它仍然可以工作。什么是更好的方法？

  export default connect(mapStateToProps, mapDispatchToProps)(RegisterScreen)
enter code here

【问题讨论】：

标签： reactjs

【解决方案1】：

IMO 在组件中执行此操作会更干净（与其容器相比，如果有的话）。

这样可以有组件没有连接到全局状态（没有容器），如果他们需要它的功能，仍然可以用 withRouter 包装。

【讨论】：

【解决方案2】：

据我所知，唯一重要的时候是当你想在mapStateToProps 中访问ownProps 中的路由器时。

您需要包装连接的组件才能访问mapStateToProps中的路由器，如下所示：

export default withRouter(connect(
  mapStateToProps, 
  mapDispatchToProps,
)(RegisterScreen));

【讨论】：