Что означают два подстановочных маршрута в реагирующей маршрутизации?

Question

Я пытаюсь понять ответный стартовый набор от kirasoft и заметил, что в их маршрутах есть две записи для подстановочного маршрута '*'. Почему их два и каков порядок старшинства? Первый маршрут, кажется, устанавливает приложение в целом, а затем второй, кажется, запускает обработчик содержимого по умолчанию... оба запускаются, и если так, какова логика между ними, они оба просто запускаются последовательно и добавляются вместе в ответе как-то?

import React from 'react';
import Router from 'react-routing/src/Router';
import http from './core/HttpClient';
import App from './components/App';
import ContentPage from './components/ContentPage';
import ContactPage from './components/ContactPage';
import LoginPage from './components/LoginPage';
import RegisterPage from './components/RegisterPage';
import NotFoundPage from './components/NotFoundPage';
import ErrorPage from './components/ErrorPage';

const router = new Router(on => {
  on('*', async (state, next) => {
    const component = await next();
    return component && <App context={state.context}>{component}</App>;
  });

  on('/contact', async () => <ContactPage />);

  on('/login', async () => <LoginPage />);

  on('/register', async () => <RegisterPage />);

  on('*', async (state) => {
    const content = await http.get(`/api/content?path=${state.path}`);
    return content && <ContentPage {...content} />;
  });
})

Answer 1

Ключевая линия в первом универсальном маршруте await next() которая даст ссылку на следующий компонент, возвращаемый из соответствия дальше по дереву маршрутов, которое затем вставляется как дочерний элемент с <App context={state.context}>{component}</App>, Второй универсальный метод возвращает ребенка во всех случаях, когда маршрут не совпадает '/contact', '/login', или же '/register', Вы можете представить себе дополнительные "дочерние элементы" для всех элементов, расположенных ниже, для более глубокого вложения компонентов по маршруту.