Как использовать множественные отклики в режиме ожидания с маршрутизатором? - PullRequest
Новая
       27

Как использовать множественные отклики в режиме ожидания с маршрутизатором?

1 голос
/ 29 мая 2019

Я использую "@reach/router": "^1.2.1", и в моем файле App.js есть резервный компонент, который отображается во время загрузки моих маршрутов: 

<React.Suspense fallback={<MainLandingPageLoadingScreen />}>
  <Router>
    <MainLandingPage path="/" />
    <AnotherLandingPage path="/coolbeans" />
    <NotFound default />
  </Router>
</React.Suspense>

Но в зависимости от маршрута я хочуиспользуйте другой загрузочный компонент как запасной вариант, например что-то вроде: 

<Router>
  <React.Suspense fallback={<AnotherLandingPageLoadingScreen />}>
    <MainLandingPage path="/" />
    <NotFound default />
  </React.Suspense>

  <React.Suspense fallback={<AnotherLandingPageLoadingScreen />}>
    <AnotherLandingPage path="/coolbeans" />
  </React.Suspense>
</Router>

Это не будет работать, потому что маршрутизатор должен быть обернут вокруг Suspense, а не наоборот.Но если я разделю его, как показано ниже, то второй список маршрутизаторов не будет выбран, и маршрут будет 404: 

<React.Suspense fallback={<MainLandingPageLoadingScreen />}>
  <Router>
    <MainLandingPage path="/" />
    <NotFound default />
  </Router>
</React.Suspense>

<React.Suspense fallback={<AnotherLandingPageLoadingScreen />}>
  <Router>
    <AnotherLandingPage path="/coolbeans" />
  </Router>
</React.Suspense>

Как правильно предоставить резервный компонент на уровне маршрутизации?

...