反应路由器错误有关链接到

我想路由组件从一个到另一个，我得到错误相关的反应路由器链接和错误的反应路由器是 - 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

反应路由器错误有关链接到

回答

相关问题