使用 react-router-dom 的 Redirect with state

Question

我一直在此处关注React-Router-Dom的重定向的文档。现在，我有一个类似的组件，以下内容：

return <Redirect to={{ pathname: '/login', state: { previousPath: path } }} />;

但是，我不确定如何在我的新路径中以状态访问previousPath。文档对此不清楚。如何访问previousPath？

Answer 1

您的父组件之一应为 Route，带有道具：匹配，位置，历史记录。您应该能够使用使用props.location.state创建的状态访问您的previousPath值。

请参阅React路由器文档中的位置。

Answer 2

在mapstatetoprops中使用ownProps解决了它：

在我的Login组件中（重定向的位置），我将其添加到我的mapStateToProps：

const mapStateToProps = (state, ownProps) => ({
    ...
    previousPath: ownProps.location.state.previousPath,
});

然后在我的道具中，现在我可以访问previousPath。

Answer 3

根据https://github.com/reaecttraining/react-router/blob/master/packages/react-react-router/docs/api/papi/redirect.md：

    <Redirect
  to={{
    pathname: "/login",
    search: "?utm=your+face",
    state: { referrer: currentLocation }
  }}
/>