ReactJs路由问题

我是ReactJs的初学者。我正在尝试创建一个多页面应用程序，但我面临着与路由相关的问题。ReactJs路由问题

这是代码：

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { Router, Route} from 'react-router'; 

...... 

ReactDOM.render((
    <Router> 
     <Route path="/" component={My}> 
      <Route path="home" component={Home}> 
       <Route path="contact" component={Contact}/> 
       <Route path="about" component={About}/> 
      </Route> 
     </Route> 

    </Router> 
), document.getElementById('root'))

来源

2017-08-18 moazzam

其反应路由器的版本，您使用的 –

@moazzam你为什么要使用，当你想创建多应用路由器做出反应？ – madhurgarg

@madhurgarg如果我走向错误的方向，那么你能请我改正？我访问过不同的博客和教程，他们做了这样的事情。 – moazzam

看来你的阵营路由器期待，你有没有提供一个历史的道具。这里是一个路由器v4的例子，它不支持路由嵌套，如问题示例中所示。

import React from 'react' 
import ReactDOM from 'react-dom' 
import { BrowserRouter, Route, Switch } from 'react-router-dom' 

    ReactDOM.render((
    <BrowserRouter> 
     <div className='App'> 
     <div className='Page'> 
      <Switch> 
       <Route exact path="/" component={1} /> 
       <Route path="/second-page" component={2} /> 
       <Route path="/third-page" component={3} /> 
       <Route component={ErrorPage} /> 
      </Switch> 
     </div> 
     </div> 
    </BrowserRouter> 
), document.getElementById('root'))

这一个会按照它们各自的路径发送组件，或者在没有路由匹配的情况下返回一个ErrorPage组件。

编辑：实际上，历史道具是无用的，并且在BrowserHistory中将被忽略，因为BrowserHistory的目的主要是创建browserHistory。

从源代码：

warning(
    !this.props.history, 
    '<BrowserRouter> ignores the history prop. To use a custom history, ' + 
    'use `import { Router }` instead of `import { BrowserRouter as Router }`.' 
)

来源

2017-08-18 13:06:11

被浏览器历史忽略，因为browserHistory的目的是创建browserHistory。你对A的含义是A并创造A？ – punkbit

ReactJs路由问题

回答

相关问题