zoukankan      html  css  js  c++  java
  • vue路由模式解析

    1、路由是由多个url组成,使用不同的url可以相应的导航到不同的位置

    2、浏览器中对页面的访问是无状态的,所以我们在切换不同的页面时都会重新进行请求,而实际使用vue和vue-router开发就会明白,在切换页面时是没有重新进行请求的,使用起来就好像页面是有状态的,这是什么原因呢。这其实是借助了浏览器的History API来实现的,这样可以使得页面跳转而不刷新,页面的状态就被维持在浏览器中了

    3、hash模式原理:window.onhashchange事件

      关键的一点是:因为hash发生变化的url都会被浏览器记录下来,从而你会发现浏览器的前进后退都可以用了,同时点击后退时,页面字体颜色也会发生变化。这样一来,尽管浏览器没有请求服务器,但是页面状态和url一一关联起来,后来人们给它起了一个霸气的名字叫前端路由,成为了单页应用标配。

    4、history模式:切换(back / forward / go)和修改(pushState / replaceState)

      通过pushstate把页面的状态保存在state对象中,当页面的url再变回这个url时,可以通过event.state取到这个state对象,从而可以对页面状态进行还原,这里的页面状态就是页面字体颜色,其实滚动条的位置,阅读进度,组件的开关的这些页面状态都可以存储到state的里面。

  • 相关阅读:
    跨域资源共享 CORS 详解
    Vue.js 与 Laravel 分离
    Laravel 5.4+Vue.js 初体验:Laravel下配置运行Vue.js
    移动端web及app设计尺寸
    另辟蹊径:vue单页面,多路由,前进刷新,后退不刷新
    vue2.0 keep-alive最佳实践
    教你用Cordova打包Vue项目
    oracle_数据处理
    oracle_集合函数
    oaracel 函数_行转列
  • 原文地址:https://www.cnblogs.com/ajaemp/p/13066169.html
Copyright © 2011-2022 走看看