react里面的路由使用react-router-dom
安装 npm i -S react-router-dom
引入 在项目的App.js或者index.js中引入
BrowserRouter as Router表示使用Router就是使用BrowserRouter<Route exact path="/" component={Landing} />exact表示指定path只有在访问'/'的时候才展示component={Landing}里面的组件,这个属性可选择性使用
import React, { Component } from 'react';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import './App.css';
import Footer from './components/layout/Footer';
import Lander from './components/layout/Lander';
import NavBar from './components/layout/NavBar';
class App extends Component {
render() {
return (
<Router>
<div className="App">
<Footer></Footer>
<Route path='/' component={Lander}></Route>
<NavBar></NavBar>
</div>
</Router>
);
}
}
export default App;
在组件里面使用的时候需要引入Link标签
import { Link } from 'react-router-dom';
class Home extends Component {
render() {
return (
<div>
<Link to="/home"/>
</div>
)
}
}
