react建立元件　　

例

import React, { Component } from 'react';
class 元件名 extends Component {
    constructor(props) {
        super(props);
        this.state = {  }
    }
    render() { 
        return (  );
    }
}
 
export default 元件名;

react引入元件需要用import引入

react的路由需要在下載的包

　　　　npm ireact-router-dom --save

引入react的路由,引入相應的元件 　　　　

　　　　import{Route,NavLink ,Redirect ,BrowserRouterasRouter}from'react-router-dom'

　　BrowserRouterasRouter 表示 引入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>