随笔- 100
文章- 0
评论- 0
阅读-
8174
前端路由的功能
- 改变url不向服务器发送请求
- 检测url的变化
- 解析url的信息来匹配路由规则
- hash模式和history模式都能够实现这个功能
hash模式
- 指的就是#和之后的字符
- hash也称作锚点，本身是作为页面定位的，可以是id对应元素显示在可视区域内。
- hash改变不会向浏览器发送请求
- hash改变会触发hashChange事件
- 浏览器的前进和后退，能够控制hash值
- html5 的history之前，都是使用hash来实现前端路由的
- hash本来是用来做页面定位的，如果用来做路由的话，锚点功能就不能用了
- hash的路由传参，有体积的限制，因为传参基于url
- hash之后的内容，不会包含在请求中
- 只能修改#之后的，所以只能设置与当前同文档的url
- 设置与当前相同的url，历史记录不会增加
history模式
- 路由传参，可以放在url里面，也可以单独放在一个对象里面
- 改变不会向浏览器发送请求
- 改变会触发onpopstate事件
- 可以设置当前同源文档的任何url
- pushState设置与当前相同的url，历史记录还是会增加
- 需要后端配合，增加一个覆盖所有情况的候选资源，如果匹配不到任何资源可以指向index.html。否则用户刷新页面，就会404
posted on
2022-03-16 11:33
社会优先于个人
阅读(
119)
评论()
编辑
收藏
举报
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 震惊！C++程序真的从main开始吗？99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码？零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾（3.3-3.9）
· winform 绘制太阳，地球，月球 运作规律