Реализуйте границы ошибок с помощью обернутого компонента

Я использую react-router-dom и заверните каждый компонент в HOC, auth, что обеспечивает аутентификацию перед рендерингом. Однако теперь я хочу реализовать границы ошибок и не могу понять, как их согласовать. Вот как мой нынешнийApp компонент настроен:

export default class App extends Component {
render() {
    return (
        <Switch>
           <Route
                path='/'
                render={() => (
                    <React.Fragment>
                        <main>
                            <Route path='/download' component={auth(Downloads)} />
                        </main>
                    </React.Fragment>
                )}
            />
        </Switch>

И вот как я считаю наиболее целесообразным реализовать границы ошибок, учитывая мое использование react-router-dom и как мне нужна оболочка границ ошибок.

<Switch>
    <Route path='/download' render={
               <ErrorBoundary>
                   <Downloads>
               </ErrorBoundary>
           }
    </Route>
</Switch>

Я просто не знаю синтаксиса, чтобы поддерживать использование auth HOC, при использовании render вместо componentопора Если есть лучший способ структурировать все это вместе, это тоже сработает.

0 ответов