00:00
好了,各位讲完了路由组件的参数之后呢,我们来聊聊路由跳转的两种模式啊,打开我们的案例啊,走。打开,那同学一上来呢,默认帮我选中about了,对吗?同学们还记不记得我之前在给大家讲路由之前,先说的就是路由的工作原理,其实呢,它主要就是对浏览器的历史记录呢进行操作,一共有两个操作,一个叫做push,一个叫做repl,对吧?Push呢,是一个压站的操作啊,是一个压一个的会留下痕迹,Replace呢,是替换掉目前的这个啊,那默认路由跳转呢,它所使用的是push模式,也就是说你每一次进行路由跳转呀,同学们都会留下痕迹啊,那你比如说现在是about,等我再点的时候,它就变成了home下的news,说老师你点的home,那不应该是home吗?我不是写了redirect吗?不让他帮我自动选中这个news嘛,对吧,好了,我再点,那它就是message。
01:04
对吧,那我再点消息一,它就是home下的message,然后是detail对吧?然后展示了消息一,哎,这些信息好同学,那既然是push模式,也就意味着这如果是浏览器历史记录,那么你首先第一次压进来的人一定是你刚开始看到的那个人,哎,我给你编个号一第一次进来的是谁呢?是about对吧,LOCALHOT3000下的about,然后呢,你又开始压战,你是不是点了home呀,由于你写了redirect,那所以说它就是这个意思了,Local host马号,然后3000下的home下的news就压进来了,然后我又点了message对吧,好,再走,这是第三个啊,我就不一点一点写了,同学,我就这么写,叉叉叉叉叉叉叉叉叉,然后呢盖home下的message对吧,好,然后。
02:04
你又点了消息一走,那这个路由就是第四个压进来的啊,什么什么什么什么下的po下的message,下的detail对吧?哎,那也就是说留下了四个痕迹,那目前我在哪儿呢?你当前所看到的一定是占顶的,所以说我可以后退,我可以回到三,回到二,回到一,我可以回到message news about,哎,那我们试一下啊,点击后退message对吧?到这儿了,点击后退news到这儿了,再后退,那就是about了,对吗?哎,也就是说默认呢,它开启的是push模式,就能留下痕迹是吧?也不替换任何一个人来一个压一个对吗?那如何开启它的re replace模式呢?啊来,那我们给大家写一下啊同学,我这里边有这个导航区对吧?我还有哪儿呢?这也是个导航区,还有哪儿呢?
03:04
这是不是也是个导航区啊,那同学这样我把消息一,消息二,消息三这三个消息跳转的时候,让它开启re replace模式,就是替换掉占顶的,好,目前你观察啊,同学我关掉,我重新开,你打开啊,我们一起观察一下,走home messageage,你看着看看一,看看二,看看三,当我后退的时候,你注意同学啊,你观察这个区域就可以,咱把二,一是不是能留下痕迹啊,再走说哎,就这样,那回到代码当中,SC下的找到home,找到message。找到message这个组件是这个是吧,那来往上看,找到路由跳转那一块,诶是不是这那样,那如何给它开启re replace模式呢?那你注意看啊,默认开启的是push,所以说它有一个属性就叫做repl,如果你调成帧好了,那么消息123那些消息在跳转的时候都是replace模式了,哎,那我们分析一波啊同学走。
04:11
首先给这个关掉,我们重新开啊,开一个最新的,防止之前的东西产生干扰,打开,那同学我想问你的是啊,我点击home,我点击message,这些路由链接都是push模式,所以说会留下痕迹对不对?哎,好,那你看现在后退的时候,走那就是news about对吧?好,来再关掉打开,那现在是我已经来刷新一下啊,走,我已经给这个重新开一下啊,打开,走,给开一个新的啊,好,About来了,那现在是我已经给谁开启了replace模式,是不是这三个消息啊,来捋顺一下,同学,这是浏览器的历史记录,首先你往里边压站的第一个是谁呢?一定是你最开始看到的杠home啊,应该是盖尔爆的对不对啊,然后压第二个。
05:03
叫做杠home,杠news对吗?好,来,咱再往下啊走。接下来你是不是点了message啊,所以说是home下的message对吗?然后同学就是我目前的这个状态了,我正在看的是不是就是message啊,是不是在这儿呢呀,好嘞,来注意观察啊,同学你说接下来我如果在点消息一的时候,它是replace模式,是不是就把这个给干掉了。对吧?那替换成了什么呢?我写在前方,你说是不是替换成这个了,杠home下的message下的detail啊对吧?哎,那就替换掉这个了,所以说同学那就点完消息一是这样的,那我点完消息二呢,是不是也替换成这个了,我点完消息三是不是也替换成这个了啊,虽然你传递的参数在地址栏里边没有体现对吧?那我想问大家,我看完一,看完二看完三,那你说其实这个人已经没了,然后留在占顶的其实就是消息三对吗?然后等我点击后退的时候,你是不是直接应该来到这个news才对呀?好,那我们试试啊,看一看二看三,已经开启了re replace模式,所以说我退回退的时候不可能再是二一,然后这样回退了,你走点回退是不是直接来到news,哎,这就是路由的replace模式与push模式,那如果说同学们你把所有的路路由链接啊都给它开启。
06:36
Replace模式,那当然开启replace模式有个简单的方式,就是这么写对吧?哎,复制跟之前谁是一样的呀,之前咱好像写过一个啊,说谁谁谁等于处,那东西是什么来着,是严格匹配吧,对吧?哎,好,那来如果说你都开启啊,那就不会留下痕迹了,你比如说来到APP里边,我给这两个人也开启rely模式啊,Replace模式就是那个about和home,然后呢,我给home里边的那个导航。
07:10
哎,就这这俩也开启re replace走,你看这个时候就体会出封装的重要性了,如果你封装的好,你传几个,他那边接几个对不对,好同学,如果要是这样的话呀,那你看着,当我打开页面,点击home,点击message,看一看二看三同学,你看是不是一点痕迹都不留下,哎,所以说就是push模式与replace模式,一个是替换,一个是压站啊,一个留下痕迹,一个不留下,好那这小节呢,我们停一下。
我来说两句