Question

在我的应用程序中，我将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));

如果我们这样导出，并在组件中设置withRouter，它仍然可以正常工作。有什么更好的方法？

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

Answer 1

IMO，在组件中比较干净（如果有的话，相对于其容器）。

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

Answer 2

据我所知，唯一重要的是何时要访问ownProps中mapStateToProps中的路由器。

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

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

在哪里放置路由器反应

2 个答案: