一个关于react-router@3.x的问题

Question

先上一张图吧

这是一个网站大概的整体布局，Header里面有导航。那么它的路由大概是这个样子的：

<Router history={history}>
        <Route path="/" component={index}>
            {/* 内部路由 */}
        </Route>
</Router>

所有的内部路由可能都会共用index组件的header和footer。

新增需求

要求nav2组件内部，不再使用index组件的header和footer，单独使用自己特定的header和footer。
其它route仍然使用index组件的header和footer，并且路由的跳转正常展示。

---

跟别人讨论了下，已经解决了这个问题；我更新下，有人如果还有这种问题可以参考下。
解决的原理：利用路由的匹配机制，如果当前路由没有匹配到，react-router会逐级向下查询，直到找到匹配的路由位置。

<Router history={history}>
        <Route path="/">
            <Route path="/" component={index}>
                {/* 内部路由 */}
            </Route>
            <Route path="*" component={NotFound}/>
        </Route>
</Router>

上面以404页面举例，一般的404页面可能不需要网站的header&footer，所以可以将它放在path="/"顶层路由内部，并且不使用index组件内部的header&footer。
而其他需要共用header&footer的组件，可以在path="/"顶层路由内部再套一层path="/"，并指定主文件，这样它内部的子路由就能沿用index组件内部的header&footer了。

我也是第一次处理这种问题，用现在的方案暂时没有发现什么bug；如果有知道其他更好方法的，欢迎补充。

Answer 1

根据路由判断，控制不同header/footer的隐藏显示 不好吗？

要么就内部路由里写header/footer