带有渲染道具的 React Router v4 HOC

Question

我想在我的路由中传递一个 props 并声明一个 HOC 以进行身份验证

目前，我使用

<Route exact path="/add" component={requireAuth(Add)} />

它正在运行，但没有道具。

我认为要传递道具，您需要使用这样的渲染语法

<Route exact path="/add" render={props => <Add {...props} type="MyProp" />}/>

但是这里有什么方法可以传递 HOC 吗？

谢谢！

Answer 1

是的，你可以。将大写变量分配给 requireAuth(Add) .

const AuthAdd = requireAuth(Add);
<Route
  exact
  path="/add"
  render={props => <AuthAdd {...props} type="MyProp" />}
/>;

Answer 2

<Route exact path="/add" component={withRouter(Add)} />

在您的 Add class 中，您将能够访问路由器道具。

React Router v4 HOC with render props