react-routing 中两个通配符路由是什么意思？答案

【问题标题】：What do two wildcard routes mean in react-routing?react-routing 中两个通配符路由是什么意思？
【发布时间】：2015-10-21 18:45:19
【问题描述】：

我试图通过kirasoft 理解 react-starter-kit，并注意到他们的路由有两个“*”通配符路由条目。为什么有两个，优先顺序是什么？第一条路线似乎在整体上设置了应用程序，然后第二条路线似乎触发了默认内容处理程序......都被触发了，如果是这样，两者之间的逻辑是什么，它们是否都只是按顺序触发并被附加以某种方式一起响应？

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} />;
  });
})

【问题讨论】：

标签： node.js reactjs isomorphic-javascript react-routing

【解决方案1】：

第一个包罗万象的路由中的关键行是await next()，它将引用从路由树更远的匹配返回的下一个组件，然后将其作为子组件插入<App context={state.context}>{component}</App>。在路由与'/contact'、'/login' 或'/register' 不匹配的所有情况下，第二个 catch-all 将返回子节点。您可以想象在树的更下方有更多的包罗万象的“孩子”，以便按路由嵌套更深的组件。

【讨论】：