mapDispatchToProps中的react-router访问历史道具

Question

如何从mapDispatchToProps访问history道具

import { withRouter } from "react-router-native";

const mapDispatchToProps = (dispatch, ownProps) => ({
   doSomething: () => ownProps.history.goBack() // history is undefined ...?? 
})

export default withRouter(connect(undefined, mapDispatchToProps)(MyComponent))

文档更清楚地说明了如何从connect mapDispatchToProps方法中访问react-router 上下文道具 ：

如果您的mapDispatchToProps函数声明为带有两个参数，则将使用dispatch作为第一个参数调用，并将传递给连接组件的props作为第二个参数调用它，

更新：

这是react-router的文档对此的评价

在大多数情况下，您可以使用链接，导航链接和重定向来执行导航操作。 有时，在某些最初由操作启动的异步任务之后，您可能还需要以编程方式导航。 例如，您可以在用户提交登录表单时调度操作。 然后，您的重击，传奇或其他异步处理程序会对凭据进行身份验证，如果成功，则需要以某种方式导航到新页面。 此处的解决方案只是将历史对象（提供给所有路由组件）包括在操作的有效负载中，并且异步处理程序可以在适当的时候使用此对象进行导航。

显然，在连接的组件内部不支持外部上下文，因此需要找到适当的整洁方法。

Answer 1

下面是实现此目的的另一种方法，但请先使用console.log检查道具中是否存在历史记录。

const mapDispatchToProps = (dispatch, ownProps) => ({
 doSomething: (history) => history.goBack() // history is undefined ...?? 
})

这样的事情你可以做...

Answer 2

对于将遇到此问题的任何人，您都可以从ownProps中的mapDispatchToProps访问react-router上下文道具，但请确保您连接的组件位于以下其中之一中：

1. 作为组件属性作为<Route component = { MyConnectedComponent }/>传递给Router
2. 如果它不是直接路由，但嵌套withRouter()深，并且需要react-router道具，请使用withRouter()包装