zoukankan      html  css  js  c++  java
  • 47. VUE-路由是什么?如何实现页面不请求刷新?

    路由是一个网络工程里面的术语。路由(routing)就是通过互联的网络把信息从源地址传输到目的地址的活动. --- 维基百科

    路由器提供了两种机制:

    路由和转送. 

    路由是决定数据包从来源到目的地的路径. 

    转送将输入端的数据转移到合适的输出端.

    生活中的路由:

    路由中有一个非常重要的概念叫路由表. 

    路由表本质上就是一个映射表, 决定了数据包的指向.

     唯一公网IP  -》  猫  - 》  路由-》 分配内网IP


    前端路由阶段:

    随着Ajax的出现, 有了前后端分离的开发模式,后端只提供API来返回数据, 前端通过Ajax获取数据, 并且可以通过JavaScript将数据渲染到页面中,最大的优点就是前后端责任的清晰, 后端专注于数据上, 前端专注于交互和可视化上。

    单页面富应用阶段:

    其实SPA最主要的特点就是在前后端分离的基础上加了一层前端路由.  也就是前端来维护一套路由规则.

    前端路由的核心是 改变URL,但是页面不进行整体的刷新,使用不请求不刷新,抽取思想进行更新页面

    简单说: 请求下载好html+css+js 。 然后实现不不请求刷新,数据也是从html+css+js 中抽取,抽自己要的,,,这些映射是路由来管理。


    如何实现不请求刷新页面:

    1.URL的hash:其实就是锚点,本质上是改变window.location的href属性,我们可以通过直接赋值location.hash来改变href, 但是页面不发生刷新:

     然后你网址就多了一个 #/  其实就是 加了个#号 然后后面跟网址,,,,这就是普通的锚点

    2.H5中的 pushState方法:

     这个方法其实就是对 历史记录进行更改,网址会直接增加/xxx ,其次 他有三个参数 最后那个是家加网址,这个有一个缺点 就是可以   前进 / 后退, 因为这类似压栈。(back、go 等方法进行前进、后退都可以。)


    3. H5中的  replaceState方法:

      

    这个和 pushState 一样的,但是呢 这个不具有前进和后退功能,就是所 浏览器不会保存你的记录,直接覆盖掉嘛,replace 是覆盖的意思。

    本文来自博客园,作者:咸瑜,转载请注明原文链接:https://www.cnblogs.com/bi-hu/p/15127841.html

  • 相关阅读:
    寒假学习进度7
    寒假学习进度3
    寒假学习进度6
    寒假学习进度5
    寒假学习进度8
    加分项
    每日博客
    每日博客
    每日博客
    每日博客
  • 原文地址:https://www.cnblogs.com/bi-hu/p/15127841.html
Copyright © 2011-2022 走看看