关于react的路由基础搭建问题

1*SRC中创建根组件APP.js,在APP.js中创建的算作一级路由

2*创建组件文件夹,创建子组件,引入子组件

3*引入react-router-dom

4*建立映射关系

5*然后就可以通过url渲染啦 

6*解决path问题,引入switch(只匹配单一路由)--套在路由外层

如果出现path内容包含问题,把重复项最多path路径的路由放在最底下

或者用exact精准匹配

7*重定向 --专用标签 from是访问哪,to是把访问的这个地方定向为目标路径

8*404页面

 

9*嵌套路由

//提示:如果父路由添加了exact精准匹配,则会导致子路由无法生成

match就是路由中的matched,放的所有层级路由的对象数組

matched中的path属性可以直接提取出来绑定path,这是第二种路由写法

10*路由的跳转

跳转分为-- 声明导航 && 编程导航

**声明导航

 **编程式导航

11*路由传参

query传参 post传参 动态路由传参

三种方法均在编程式导航方法中编写

query传参

post传参(安全性较高,没有长度显示) 

动态路由传参

 

参数检测可以用console.log(this.props) 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值