最近的业务涉及到了axios的拦截器，要在request.js里面要根据状态码来跳转页面，这时候我就面对了几种跳转选择：

1、使用location.href='/url'来跳转，简单方便，但是刷新了页面。

2、使用history.pushState('/url')，无刷新页面，静态跳转。

3、引进router，然后使用router.push('/url')来跳转，使用了diff算法，实现了按需加载，减少了dom的消耗。

其实使用router跳转和使用history.pushState()没什么差别的，因为vue-router就是用了history.pushState()，尤其是在history模式下。

vue路由切换和用location切换url的区别的更多相关文章

  1. vue路由\导航刷新后:ative\localStorage\url截取参数

    <el-menu :default-active="$route.path" router mode="horizontal"> <el-me ...

  2. Vue路由的hash模式与history模式的区别?

    1.首先router有两种模式:hash模式(默认).history模式(需配置mode: 'history') hash和history的区别?   hash                    ...

  3. Vue路由实现之通过URL中的hash（#号）来实现不同页面之间的切换（图表展示、案例分析、附源码详解）

    前言 本篇随笔主要写了Vue框架中路由的基本概念.路由对象属性.vue-router插件的基本使用效果展示.案例分析.原理图解.附源码地址获取. 作为自己对Vue路由进行页面跳转效果知识的总结与笔记. ...

  4. vue路由+vue-cli实现tab切换

    第一步:搭建环境 安装vue-cli cnpm install -g vue-cli安装vue-router cnpm install -g vue-router使用vue-cli初始化项目 vue ...

  5. vue路由中 Navigating to current location ("/router") is not allowed

    报错原因:多次点击同一路由,导致路由被多次添加 解决方法: router/index中添加以下代码: //router/index.js Vue.use(VueRouter) //导入vue路由 co ...

  6. Vue路由vue-router

    前面的话 在Web开发中,路由是指根据URL分配到对应的处理程序.对于大多数单页面应用,都推荐使用官方支持的vue-router.Vue-router通过管理URL,实现URL和组件的对应,以及通过U ...

  7. vue路由原理剖析

    单页面应用(SPA)的核心之一是: 更新视图而不重新请求页面, 实现这一点主要是两种方式: 1.Hash: 通过改变hash值 2.History: 利用history对象新特性(详情可出门左拐见:  ...

  8. react router @4 和 vue路由 详解(全)

    react router @4 和 vue路由 本文大纲: 1.vue路由基础和使用 2.react-router @4用法 3.什么是包容性路由?什么是排他性路由? 4.react路由有两个重要的属 ...

  9. 初印象至Vue路由

    初印象系列为快速了解一门技术的内容,后续会推出本人应用这门技术时发现的一些认识. Vue路由和传统路由的区别: Vue路由主要是用来实现单页面应用内各个组件之间的切换,同样支持传递参数等功能.而传统路 ...

随机推荐

  1. ASP .Net Core 中间件的使用（一）：搭建静态文件服务器/访问指定文件

    前言 随着Asp .Net Core的升级迭代,很多开发者都逐渐倾向于.net core开发. .net core是一个跨平台的应用程序,可以在windows.Linux.macOS系统上进行开发和部 ...

  2. vue 事件函数传参

    事件函数传参 在元素绑定事件时候,如果我们的函数没有传参,他也会有一个默认的传参值 event 但是如果我们的函数有传参,那么它必须作为做为最后一个传参值显示传递,且必须为$event 通过代码打印我 ...

  3. Cloudera Manager API使用

    Cloudera Manager提供了很多API供用户进行访问,因此可以利用其提供的API进行大数据集群中各种服务的状态检测.监控以及服务的启停操作. 版本信息 Cloudera Manager 6. ...

  4. 02-Dockerfile的基本使用

    1. FROM 作用:指定基础镜像 使用:FROM 镜像名 demo: FROM mysql FROM mysql:5.6 2. RUN 作用:指令是用来执行命令行命令的 使用: shell格式:RU ...

  5. [JVM工具(1)] 堆栈检查利器jstat的使用

    jstat 可以检查 JVM 整体的运行情况,可以看到 新生代,老年代等的内存使用情况,以及GC 次数和耗时 命令格式 如 jstat -<option> [-t] [-h<line ...

  6. Spark性能调优篇八之shuffle调优

    1 task的内存缓冲调节参数 2 reduce端聚合内存占比 spark.shuffle.file.buffer                     map task的内存缓冲调节参数,默认是3 ...

  7. 2020 史上最全IDEA插件总结

    最喜欢的一句话: 1.01的365次方=37.78343433289 >>>1 0.99的365次方= 0.02551796445229, 每天进步一点点的目标,贵在坚持 IDEA ...

  8. 推荐系统实践 0x12 什么是Embedding

    做过深度学习的小伙伴,大家应该多多少少都听说过Embedding,这么火的Embedding到底是什么呢?这篇文章就用来介绍Embedding.另外,基于深度学习的推荐系统方法或者论文还没有结束,我打 ...

  9. Mysql联合索引的最左前缀原则以及b+tree

    软件版本mysql5.7 根据官网的文档 https://dev.mysql.com/doc/refman/5.7/en/multiple-column-indexes.html 查询条件要符合最左原 ...

  10. iOS UIcollectionView 实现卡牌翻转效果

    - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typica ...