reactjs

Question

我正在玩 reactjs 路由。在所有示例中，路由总是嵌套的，例如

<Route path="/" handler={App} >
    <Route name="about" handler={About} />
    <Route name="contact" handler={Contact} />
</Route>

是否可以有简单的非嵌套路由，如下所示？

 <Route path="/" handler={App} />
 <Route name="about" handler={About} />
 <Route name="contact" handler={Contact} />

更新：

var routes = (
    <Route name="root" handler={Root}>
        <Route path="/" handler={Home} />
        <Route path="/home" handler={Home} />
        <Route path="/about" handler={About} />
        <Route path="/projects" handler={Projects} />
        <Route path="/contact" handler={Contact} />
    </Route> 
);

奇怪的问题，在按照下面的回答建议更新到此之后。 name 不再有效，只有 path 有效？我不得不更新我的路线。任何的想法？

Answer 1

看来不可能。但我正在使用一个技巧来模拟这种行为：

var Routes = (
    <Route name="root" handler={Root}>
        <Route name="checkout" path="/checkout/:step" handler={Checkout}/>
        <Route name="application" path="/" handler={Application}>
            <DefaultRoute handler={Promo}/>
            <Route name="agreement" handler={Agreement}/>
            <Route name="policy" handler={Policy}/>
            <Route name="how-it-works" handler={Brief}/>
            <Route name="login" handler={Login}/>
            <Route name="faq" handler={Faq}/>
            ...
            <NotFoundRoute handler={NotFound}/>
        </Route>
        <NotFoundRoute handler={NotFound}/>
    </Route>
);

其中 Root 只是一个基本的 html 页面，带有 body 标记，内容由路由处理程序呈现。

在这里，我需要一个页面布局不同但与协议或登录页面处于相同路径段级别的结帐页面。

reactjs - 是否可以有非嵌套路由

reactjs - Is it possible to have non nested routes

react-router