React-Router - 未捕獲TypeError：無法讀取未定義的屬性'route'

嘗試使用react v4與redux並運行到此錯誤，似乎是跟隨文檔，無法找到任何地方的任何信息，所以我茫然表現：React-Router - 未捕獲TypeError：無法讀取未定義的屬性'route'

Uncaught TypeError: Cannot read property 'route' of undefined

這裏是我的代碼：

import React, {Component} from 'react'; 
import { 
    BrowserRouter as Router, 
    Route, 
    Link, 
    withRouter 
} from 'react-router-dom' 
import Menu from './Menu'; 
import { connect } from "react-redux"; 
import Play from './Play'; 
class Manager extends Component { 
    render() { 
     return(
      <Router> 
       <div> 
        <Route exact path="/" component={Menu}/> 
        <Route path="/menu" component={Menu}/> 
        <Route path="/play" component={Play}/> 
       </div> 
       </Router> 
     ) 
    } 
} 
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Manager));

，這裏是完整的錯誤：

game.js:26838 Uncaught TypeError: Cannot read property 'route' of undefined 
    at Route.computeMatch (game.js:26838) 
    at new Route (game.js:26815) 
    at game.js:15322 
    at measureLifeCyclePerf (game.js:15102) 
    at ReactCompositeComponentWrapper._constructComponentWithoutOwner (game.js:15321) 
    at ReactCompositeComponentWrapper._constructComponent (game.js:15307) 
    at ReactCompositeComponentWrapper.mountComponent (game.js:15215) 
    at Object.mountComponent (game.js:7823) 
    at ReactCompositeComponentWrapper.performInitialMount (game.js:15398) 
    at ReactCompositeComponentWrapper.mountComponent (game.js:15285)

來源

2017-04-11 Rob McMackin

你嘗試從改變'「反應，路由器dom''到'從'react-router''？ –

嘗試像'react-router''這樣的'import {withRouter}'從'react-router'中導入withRouter –

這兩種方法都不幸工作。 –

你不需要withRouter更高的使用比你的實際路由器是:) 只是將其刪除：

export default connect(mapStateToProps, mapDispatchToProps)(Manager);

您將需要使用withRouter HOC，如果你想訪問嵌套在路由組件內部歷史信息。你可以在這裏找到詳細信息：https://reacttraining.com/react-router/web/api/withRouter

來源

2017-04-18 06:33:56

這解決了我的問題，它與上面的OP匹配。 –

所以我從我的本地服務器上運行它，當我從它運行的webpack服務器上運行它時。

來源

2017-04-20 00:46:41

我通過我的<Navigation />我<Router></Router>

來源

2017-05-01 23:48:25 shay

改變內部路由器移動到一個所謂的新反應路由器4.0修復了這個使用NPM /紗安裝模塊「反應路由器-DOM」

「反應路由器-dom「，像這樣定義你的路由器..

不要忘記進口。從'react-router-dom'導入{BrowserRouter，Route};

  <BrowserRouter> 
       <div> 
       <Route exact path="/" component={Menu}/> 
       <Route path="/menu" component={Menu}/> 
       <Route path="/play" component={Play}/> 
       </div> 
      </BrowserRouter>

來源

2017-05-17 23:29:17

如果你仍然有問題隨時給我發信息:) –

您好，我得到相同的錯誤「TypeError：無法讀取未定義的屬性'路由器'我已經安裝react-router-dom模塊做npm install react-router-dom並導入模塊，並試圖通過「this.props.router.push（'/＃/儀表板'）」重定向 –

在這裏，你正在使用的反應路由器-DOM最新版本4.0.0以上。

因此，沒有可用的路由器。您需要在此版本中使用BrowserRouter。

你的代碼將

import React, {Component} from 'react'; 
import { 
    Switch, 
Route, 
Link, 
withRouter 
} from 'react-router-dom' 
import Menu from './Menu'; 
import { connect } from "react-redux"; 
import Play from './Play'; 
class Manager extends Component { 
    render() { 
    return(<div> 
     <Switch> 

       <Route exact path="/" component={Menu}/> 
       <Route path="/menu" component={Menu}/> 
       <Route path="/play" component={Play}/> 

      </Switch></div> 
    ) 
} 
} 
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Manager));

，並使用BrowserRouter在index.js文件呈現此組件

import { BrowserRouter } from 'react-router-dom'; 
ReactDOM.render((<BrowserRouter><Manager/></BrowserRouter>), document.getElementById('root'));

來源

2017-07-19 09:21:49

React-Router - 未捕獲TypeError：無法讀取未定義的屬性'route'

回答

相關問題