反應路由器錯誤有關鏈接到

我想路由組件從一個到另一個，我得到錯誤相關的反應路由器鏈接和錯誤的反應路由器是 - Failed to compile我已經嘗試使用反應路由器和添加它的包到我的項目庫。反應路由器錯誤有關鏈接到

這裏是代碼的什麼我做的路線做： -
1）Index.js文件] [2]
2）Navlink.js文件] [3]
3）[NAV .js文件] [4]

在Index.js我做了一個路由器的渲染方法，但它顯示上面的錯誤。
在Navlink.js我做了一個鏈接返回類，它提供了鏈接和所有屬性。
在nav.js文件中，我使用導航navlink.js文件導航。但是錯誤不斷出現，並且這個鏈接並不存在於反應路由器中，並且hashHistory不存在於反應路由器中。

如果有人知道請幫忙。

1）Index.js

import React, { Component } from 'react'; 
 
import ReactDOM from 'react-dom'; 
 
import { Router, Route, hashHistory } from 'react-router'; 
 
import './index.css'; 
 
import App from './App'; 
 
import Homecontent from './homepage'; 
 
import Foo from './footer'; 
 
import registerServiceWorker from './registerServiceWorker'; 
 
import ourAdvantages from './ouradvantage'; 
 
import LoginForm from './loginform'; 
 
import BoRegistration from './boregistration'; 
 
import VoRegistration from './voregistration'; 
 

 
ReactDOM.render(<App />, document.getElementById('header')); 
 
registerServiceWorker(); 
 
// ReactDOM.render(<Homecontent />, document.getElementById('homecontent')); 
 
ReactDOM.render((
 
    <Route path="/" component={App}> 
 
     <Route path="/loginform" component={LoginForm}> 
 
     </Route> 
 
    </Route> 
 
), document.getElementById('homecontent')) 
 
//ReactDOM.render(<LoginForm />, document.getElementById('loginform')); 
 
//ReactDOM.render(<BoRegistration />, document.getElementById('boRegistration')); 
 
//ReactDOM.render(<VoRegistration />, document.getElementById('voRegistration')); 
 
//ReactDOM.render(<ourAdvantages />, document.getElementById('ouradvantages')); 
 
ReactDOM.render(<Foo />, document.getElementById('footer'));

2）navLink.js

import React from 'react' 
 
import { Link } from 'react-router' 
 

 
export default React.createClass({ 
 
    render() { 
 
    return <Link {...this.props} activeClassName="active"/> 
 
    } 
 
})

3）nav.js

class NavMenu extends Component { 
 
    render(){ 
 
    return (
 
     <ul className="navbar-nav"> 
 
     <li className="nav-item"> 
 
     <navLink to="/loginform/reactjs/react-router"><a className="nav-link" href="#">Home</a></navLink> 
 
     </li> 
 
     <li className="nav-item"> 
 
     <a className="nav-link" href="#">Our Advantages</a> 
 
     </li> 
 
     <li className="nav-item"> 
 
     <a className="nav-link" href="#">Offers</a> 
 
     </li>

來源

2017-09-04 Husain Khanbahadur

什麼是你的版本或'react-router'？ – Panther

@Panther你可以給我終端命令來檢查反應路由器的版本嗎？ –

'npm ls react-router'應該給你'react-router'版本。 'npm ls'會列出所有模塊及其版本。 – Panther

我希望你正在使用react-router 4倍。在這些新版本中，您必須從react-router-dom導入Link。

import { Link } from 'react-router-dom';

您可以在這裏查看相同的商品https://reacttraining.com/react-router/web/api/Link。

但我希望你正在遵循一些教程或仍然使用react-router 3.x風格。所以要麼你必須使用react-router的正確版本，要麼根據版本遵循正確的寫作風格。

來源

2017-09-04 13:32:45 Panther

這件事我已經做了。但它顯示該模塊未找到。 –

你能爲此提出一個很好的教程。 –

這個是v4 https://medium.com/@pshrmn/a-simple-react-router-v4-tutorial-7f23ff27adf。但是，您可以執行'npm uninstall react-router'，然後執行'npm install [email protected]並繼續進行當前的工作。 – Panther

反應路由器錯誤有關鏈接到

回答

相關問題