react——路由加载失效

• 需求路由动态加载组件

<Route path="/index/" exact component={AddArticle} />
<Route path="/index/add" exact component={AddArticle} />
<Route path="/index/add/:id" exact component={AddArticle} />
<Route path="/index/list/" exact component={ArticleList} />

• 问题：切换路由的时候白屏
• 原因：父路由使用了精确匹配

<Router>
      <Route path="/" exact component={ Login } />
      <Route path="/index/" exact  component={ AdminIndex } />
</Router>

• 解决
  去掉父路由的精确匹配

<Router>
      <Route path="/" exact component={ Login } />
      <Route path="/index/" component={ AdminIndex } />
</Router>

• 分析
  父路由精确匹配 /index/，子路由下的其他路由如/index/list 不在总的Router匹配项中，所以页面没有对应组件显示。