美文网首页
React Router v4相关

React Router v4相关

作者: ZZES_ZCDC | 来源:发表于2018-03-19 10:16 被阅读66次

最近在用react router v4,记录一下

基本配置

import React from 'react'
import {BrowserRouter, Route, Switch} from 'react-router-dom'
import App from './App'
import Tips from './component/home/tips'
const Router = () => (
  <main>
    <BrowserRouter>
      <Switch>
        <Route  exact path='/' component={App}/>
        <Route  exact path='/ttt/:id' component={Tips}/>
        <Route render={() => '404'}/>
      </Switch>
    </BrowserRouter>
  </main>
)

结合Antd Mobile的 TabBar

主要想法就是TabBar调的页面不用上路由,直接就组件的切换,固定为/路由

image.png

各个分页面的里面页面分别搞路由
然后在里面的页面中加入个返回按钮即可,返回到/路由

image.png

路由传参

网上介绍的赶紧都有问题,
还是看官方文档

image.png
以下是我把this.props打印出来的信息
image.png
可以看到,路由传来的参数在 match.params

相关文章

网友评论

      本文标题:React Router v4相关

      本文链接:https://www.haomeiwen.com/subject/ryyuqftx.html