react-router 4.0(一)

import React from 'react';
import ReactDOM from 'react-dom'
import {Link,Route,HashRouter} from 'react-router-dom'
//HashRouter在开发阶段用
const Home = () => (
  <div>
    <h2>首页</h2>
  </div>
)

export default class App extends React.Component {

  render(){
    return(
      <HashRouter>
        {/* 包裹的为路由元素,不生成dome节点 */}
        <div>
          <Link to="/">主页</Link>
          <Link to="/one">第一页</Link>
          <Link to="/two">第二页</Link>

          <Route exact path="/" render={()=>(
              <h2>主页</h2>
              // 这个render返回的其实是一个js对象
          )}/>
          <Route path="/one" render={()=>(
              <h2>第一页</h2>
          )}/>
          <Route path="/two" render={()=>(
              <h2>第二页</h2>
          )}/>
        </div>
      </HashRouter>
    )
  }
}

ReactDOM.render(<App/>,document.getElementById("app"))

猜你喜欢

转载自www.cnblogs.com/BlogRegisterboby/p/9287874.html