Как передать реквизит компонентам в Routes?

Question

Я использую withLayout, чтобы обернуть вокруг каждого компонента в Switch Route. Но при этом я не могу получить props унаследованное на SignIn странице. Файл моего приложения. js выглядит следующим образом:

function withLayout(WrappedComponent, props) {
  // ...and returns another component...
  return class extends React.Component {
    render() {
      return (
        <Layout>
          <WrappedComponent></WrappedComponent>
        </Layout>
      );
    }
  };
}

class App extends Component {
  render() {
    return (
      <React.Fragment>
        <Provider store={store}>
          <Router>
            <React.Suspense fallback={<div></div>}>
              <Switch>
                <Route exact path="/" component={withLayout(HomePage)} />
                <Route exact path="/login" component={withLayout(SignIn)} />
                <Route
                  exact
                  path={["/apply"]}
                  component={withLayout(NewQuote)}
                />
              </Switch>
            </React.Suspense>
          </Router>
        </Provider>
      </React.Fragment>
    );
  }
}

export default withRouter(App);

Если я не использую упаковщик макетов, я могу просто сделать следующее, чтобы получить реквизиты:

component={props => <SignIn {...props} />}

Но теперь, как я могу получить реквизит, используя обертку вокруг компонента? Спасибо!

Answer 1

Похоже, я могу поставить следующее, чтобы пропущенные реквизиты делали дочерний компонент

<Route
                  exact
                  path="/login"
                  component={props => (
                    <Layout>
                      <SignIn {...props} />
                    </Layout>
                  )}
                />