美文网首页
router原理

router原理

作者: wangwenquan1234 | 来源:发表于2019-01-15 09:26 被阅读0次

什么是路由

router(路由)是一种处理访问先后关系的机制,简单说就是允许我们再不同页面中跳转,记录跳转关系还能原路退回去的机制。
路由包含了三个主要部分。

  • 路由历史:栈的形式的数据结构,通过入栈和出栈的方式记录访问过程
  • 跳转,负责在不同页面的跳转动作
  • 事件:打开新页面,或者回退到上一个页面时触发的逻辑

常见的router

  • 页面router:最常见的一种形式,页面真正的跳转,跳转以后整个页面会按照新的路径重新加载


    image.png
  • hash router:这种路由在跳转的时候只有hash值再变化,页面没有重新加载,只是调到了页面hash指定的状态,最早在做单页面应用的时候就是用这种方式来模拟浏览器自带的路由,它的兼容性也是很好的


    image.png
  • H5 router:为JS的history对象中提供了一些新的方法,用来手动的在路由历史中提供一个新值,功能跟hash路由是类似的,但是它比hash优秀的地方是能够操控路径,相对的兼容性会比较差


    image.png

相关文章

  • react-router

    [react-router]路由原理 参考链接 [react-router]hashHistory和browser...

  • 手写 Vue Router、手写响应式实现、虚拟 DOM 和 D

    Vue-Router 原理实现 一、Vue-Router 动态路由 二、Vue-Router 嵌套路由 三、Vue...

  • router原理

    https://juejin.im/post/5b5697675188251b11097464 Vue Route...

  • router原理

    什么是路由 router(路由)是一种处理访问先后关系的机制,简单说就是允许我们再不同页面中跳转,记录跳转关系还能...

  • 重点掌握

    【前端性能优化汇总】【Webpack原理+React原理+Redux+React Router】【输入URL后发生...

  • 每日一题

    1.router实现原理2.css居中方式

  • React Router原理

    原文地址 http://blog.poetries.top/2018/12/20/react-router-ana...

  • React Router-简单原理

    以下内容主要参考自 深入理解 react-router 路由系统react-router的实现原理前端路由实现与 ...

  • 一起学Vue:路由(vue-router)

    前言 学习vue-router就要先了解路由是什么?前端路由的实现原理?vue-router如何使用?等等这些问题...

  • Router 原理及 React-Router

    页面路由(浏览器路由) 页面会刷新 hash路由 页面不会刷新,之前做单页应用,使用的传统方法。 h5 路由 h5...

网友评论

      本文标题:router原理

      本文链接:https://www.haomeiwen.com/subject/ehredqtx.html