(十三)React路由react-router4.x的基本配置

–react-router可以让跟组件动态的挂载其他的不同组件

–根据用户访问的地址动态的加载不同的组件

步骤:

–1 安转模块

cnpm install react-router-dom --save

–2 引入模块

//先引入需要路由的组件
import Home from './component/Home';
import New from './component/News';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom'

–3 根组件中引入

在根组件中引入

return(
    <Router>
        <div>
        <header className="title">
            <Link to='/'>首页</>
            <Link to='/news'>新闻</>
        </header>
        
            <Route exact path='/' componet={Home}/>
            <Route exact path='/news' componet={News}}/>
        </div>
    </Router>
);