react创建组件
例
import React, { Component } from ‘react‘;
class 组件名 extends Component {
constructor(props) {
super(props);
this.state = { }
}
render() {
return ( );
}
}
export default 组件名;
react引入组件需要用import引入
react的路由需要在下载的包
npm i react-router-dom --save
引入react的路由,引入相应的组件
import { Route,NavLink ,Redirect ,BrowserRouter as Router} from ‘react-router-dom‘
BrowserRouter as Router 表示 引入BrowserRouter 并用 Router 的名字来代替，在app.js里面<Router></Router>；
Route表示每个路由，path是输入的地址，component是引入的组件的名字；
Redirect表示路由的重定向；
NavLink 表示需要路由到的地方，to表示到哪个路由
render() { return ( <div> <Router> <Route path=‘/message‘ component={Message} /> <Route path=‘/tong‘ component={Txl} /> <Route path=‘/find‘ component={Find} /> <Route path=‘/mine‘ component={Mine} /> <Redirect from="/*" to="/message" /> {/*路由重定向*/} <Footer/> </Router> </div> ); }
<footer className="footerMenu">
<ul>
<li><NavLink to=‘/message‘>消息</NavLink></li>
<li><NavLink to=‘/tong‘>通讯录</NavLink></li>
<li><NavLink to=‘/find‘>发现</NavLink></li>
<li><NavLink to=‘/mine‘>我的</NavLink></li>
</ul>
</footer>
二级路由：
在每个一级路由到的位置，写下路由
<Route path ="/mine/login" component = {Login} ></Route>
<Route path = "/mine/reg" component = {Reg} ></Route>
原文：https://www.cnblogs.com/52580587zl/p/13497679.html