VUE路由原理

我的梦境 提交于 2019-12-06 05:45:58

1: hash

2: history

区别: 前者地址栏会带有#,后者没有,显得美观一点

 

路由原理:前段路由实现本质是监听URL的变化,然后匹配路由规则显示相应页面,并且无须刷新。

 

hash模式:

      a: 点击或浏览器历史跳转时,触发onhashchange事件,然后根据路由规则匹配显示相应页面(遍历路由表,装载相应组件到router-link);

      b: 手动刷新时,不会像服务器发送请求(不会触发onhashchange),触发onload事件,然后根据路由规则匹配显示相应页面;

    

history模式:

     a:跳转时会调用history.pushState方法,根据to属性改变地址,并切换相应组件到router-link;

     b:浏览器历史操作(前进,后退),只会改变地址栏(页面内容不会变),不会切换组件,需要使用popstate方法来切换组件;

     c: 手动刷新,需要后端配合重定向,不然404

 

 

 

 

 

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!