Vue应用页面跳来跳去,为什么又是单页面应用呢?

单页Web应用(single page web application,SPA),就是只有一张Web页面的应用。单页应用程序 (SPA) 是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。 [1]  浏览器一开始会加载必需的HTML、CSS和JavaScript,所有的操作都在这张页面上完成,都由JavaScript来控制。因此,对单页应用来说模块化的开发和设计显得相当重要。                                                                                                                ------百度百科

在vue中路由切换有两种方式(暂不谈服务端渲染),分别为hash和history 。

回答标题的问题,其实就是回答vue中hash模式和history模式的实现原理。

hash模式

        hash模式在vue中的实现是通过监听hashChange事件,获取地址改变后#后面的值,通过这个值在路由表routes中匹配相对应的component,并执行render来实现的。整个过程中并没有向后台发送请求获取一个新的HTML页面。

history模式

        history允许开发者直接更改前端路由(H5新特性),也就是改变地址栏url路径,但是并不会重新发起请求

        history模式的实现利用了它的两个重要的API:pushState和replaceState,这两个API都是可以改变url的,此时就通过监听url的变化来进行更新页面部分内容。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值