Question

我正在使用带有react-bootstrap的React Router v4。问题是，当我尝试使用react-bootstrap设置样式时，单击“FrontPage”或“关于”页面时，路由不起作用。如果我取下react-boostrap，路由工作正常。我该如何修复它以便与react-boostrap配合使用？

 <ul>
      <li><Link to='/'>Home</Link></li>
      <li><Link to='/about'>About</Link></li>
      <li><Link to='/frontPage'>frontPage</Link></li>
    </ul>
    <hr/>
      <Route exactly path='/' component={Home}/>
      <Route path='/about' component={About}/>
      <Route path='/frontPage' component={FrontPage}/>

上面的代码可以使用，但下面的代码不会。

          <Nav>
            <NavItem><Link to='/frontpage' > Adventure</Link></NavItem>
            <NavItem><Link to='/about' > About</Link></NavItem>
              <hr/>
                <Router exact path='/' component={Home}/>
                <Router path='/frontpage' component={FrontPage}/>
                <Router path='/about' component={About}/> 
           </Nav>

我在控制台中遇到错误：

ReferenceError: path is not defined
    at C:\Users\louis\desktop\testreact\server.js:24:23
    at Layer.handle [as handle_request] (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\route.js:137:13)
    at Route.dispatch (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\route.js:112:3)
    at Layer.handle [as handle_request] (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\layer.js:95:5)
    at C:\Users\louis\desktop\testreact\node_modules\express\lib\router\index.js:281:22
    at param (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\index.js:354:14)
    at param (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\index.js:365:14)
    at Function.process_params (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\index.js:410:3)
    at next (C:\Users\louis\desktop\testreact\node_modules\express\lib\router\index.js:275:10)
    at SendStream.error (C:\Users\louis\desktop\testreact\node_modules\serve-static\index.js:121:7)
    at emitOne (events.js:96:13)
    at SendStream.emit (events.js:188:7)
    at SendStream.error (C:\Users\louis\desktop\testreact\node_modules\send\index.js:282:17)
    at SendStream.onStatError (C:\Users\louis\desktop\testreact\node_modules\send\index.js:433:12)
    at onstat (C:\Users\louis\desktop\testreact\node_modules\send\index.js:734:26)

澄清问题：如果我没有使用react-boostrap进行样式化，当我点击首页和关于页面时，路由将按照预期的方式切换到所需的路由。但是，一旦我用自举标签包装路由，我就无法从一个页面切换到另一个页面。它返回“路径未定义”。

Answer 1

老兄，你把路由器没有路由，除非那是故意的 https://reacttraining.com/react-router/web/api/Router https://reacttraining.com/react-router/web/api/Route 路由器不接受路径

React Router v4.0.0 +反应引导程序

1 个答案: