前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >React Router v4相关

React Router v4相关

作者头像
治电小白菜
发布2020-08-25 15:12:59
4590
发布2020-08-25 15:12:59
举报
文章被收录于专栏:技术综合技术综合

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

基本配置

代码语言:javascript
复制
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

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 基本配置
  • 结合Antd Mobile的 TabBar
  • 路由传参
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档