Question

也许有人知道为什么我可以创建子路由我的代码。

<Provider store={store}>
    <Router history={history}>
      <Route path="/" component={Main} >
        <IndexRoute component={Home} />
        <Route path="performance" component={Performance} />
        <Route path="home" component={Home} >
          <Route path="alert" component={Performance} />
        </Route>
      </Route>
    </Router>
</Provider>

// ...
// imports
import Main from './Main'
import Performance from './performance/PerformanceComponent'
import Home from './home/HomeComponent'

import {Router, Route, IndexRoute} from 'react-router'
import {Provider} from 'react-redux'

我不能去这个地址 - ＆gt; /家庭/警报

并在控制台中出现此错误

alert:11 GET http://0.0.0.0:3001/home/css/style.css 
alert:12 GET ...home/css/home.css 
alert:13 GET ...home/css/detailsView.css 
alert:26 GET ...home/bundle.tvc.js

我的意思是如果我写错地址我有特殊错误

Warning: [react-router] Location "/homealert" did not match any routes

我不知道该如何修复它。提前谢谢！

Answer 1

如果您希望在Performance上呈现/home/alert组件，则需要此选项。您需要在每个匹配的Route上指定完整路径。

  <Route path="/" component={Main} >
    <IndexRoute component={Home} />
    <Route path="/performance" component={Performance} />
    <Route path="/home" component={Home} >
      <Route path="/home/alert" component={Performance} />
    </Route>
  </Route>

嵌套路由适用于组件，而不适用于路径。您的应用将呈现如下/home/alert：

<Main>
  <Home>
    <Performance>

React-Router无法生成子路由

1 个答案: