React Router v4 HOC with render props

Question

我想通过道具并在我的路线中宣布一个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

与withRouter使用。

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

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