1.首先router有两种模式：hash模式（默认）、history模式（需配置mode: 'history'）

hash和history的区别?

  hash                                          history                      
url显示 有# 无#
回车刷新 可以加载到hash值对应页面 一般就是404掉了
支持版本 支持低版本和IE浏览器 HTML5新推出的API

正确回答:hash模式url里面永远带着#号,我们在开发中默认使用这个模式。那么在声明时候要用history模式呢?

如果用户考虑url的规范那么就需要使用history模式,因为history模式没有#号,是个正常的url适合推广宣传。当然其功能也有区别,比如我们在开发app的时候有分享页面,那么这个分享出去的页面就是用vue或者react做的,咋们把这个页面分享到第三方的app里,有的app里面url是不允许带有#号的,所以要将#去除那么就要使用history模式,但是使用history模式还有一个问题就是,在访问二级页面的时候,做刷新操作,会出现404错误,那么就需要和后端人员配合让他配置一下apache或是nginx的url重定向,重定向到你的首页路由上就可以了。

Vue路由的hash模式与history模式的区别?的更多相关文章

  1. 【前端路由】Vue-router 中hash模式和history模式的区别

    咱们今天说说VUE路由的hash模式与history模式的区别,这个也是面试常问的问题,不要小看这道题其实问到这里的时候那个面试官应该是个大牛,开发经验丰富,这个题其实就是考验你的开发经验是否属实. ...

  2. Vue中hash模式和history模式的区别

    vue-router 中hash模式和history模式. 在vue的路由配置中有mode选项,最直观的区别就是在hash模式下的地址栏里的URL夹杂着‘#’号 ,而history模式下没有.vue默 ...

  3. vue开发多页面应用 - hash模式和history模式

    我们知道vue可以快速开发web单页应用,而且官方为我们提供了自己的应用脚手架vue-cli,我们只需要下载脚手架,安装依赖后就可以启动vue应用雏形. 这得益与webpack的依赖追踪,各种资源后缀 ...

  4. 前端路由的两种模式： hash 模式和 history 模式

    随着 ajax 的使用越来越广泛,前端的页面逻辑开始变得越来越复杂,特别是spa的兴起,前端路由系统随之开始流行. 从用户的角度看,前端路由主要实现了两个功能(使用ajax更新页面状态的情况下): 记 ...

  5. 前端路由的两种模式:hash(#)模式和history模式(转)

    随着 ajax 的使用越来越广泛,前端的页面逻辑开始变得越来越复杂,特别是spa的兴起,前端路由系统随之开始流行. 从用户的角度看,前端路由主要实现了两个功能(使用ajax更新页面状态的情况下): 记 ...

  6. vue-router的hash模式与history模式的对比

    Vue-router 中hash模式和history模式的关系在vue的路由配置中有mode选项 最直观的区别就是在url中 hash 带了一个很丑的 # 而history是没有#的mode:&quo ...

  7. Vue-router 中hash模式和history模式的区别

    实际上存在三种模式: Hash: 使用URL的hash值来作为路由.支持所有浏览器. History: 以来HTML5 History API 和服务器配置.参考官网中HTML5 History模式 ...

  8. hash模式与history模式

    随着 ajax 的使用越来越广泛,前端的页面逻辑开始变得越来越复杂,特别是spa的兴起,前端路由系统随之开始流行. 从用户的角度看,前端路由主要实现了两个功能(使用ajax更新页面状态的情况下): 记 ...

  9. Vue 的路由实现 Hash模式 和 History模式

    Hash 模式: Hash 模式的工作原理是onhashchange事件,Window对象可以监听这个事件... 可以通过改变路径的哈希值,来实现历史记录的保存,发生变化的hash 都会被浏览器给保存 ...

随机推荐

  1. mysql 之 清空表中数据

    清空表的时候注意外键约束 命令版 查询数据库中所有表名select table_name from information_schema.tables where table_schema='DB_n ...

  2. java之重载与重写

    重写(override) 重写是子类对父类的允许访问的方法的重新编写,方法名,返回值类型和形参列表都不能改变,唯一恩能够改变的是方法体. 重写的好处是可以根据子类的需要的行为来实现父类的方法. 重写方 ...

  3. Eureka重点原理解析

    前言 带着问题学习,事半功倍.本文将对如下几个问题进行总结说明: 1.EurekaServer端服务注册的流程和设计模式 2.Eureka服务续约的bug 3.EurekaClient的启动流程 4. ...

  4. 2.Python是什么？使用Python的好处是什么？

    Python是什么?使用Python的好处是什么? 答: Python is a programming language with objects, modules, threads, except ...

  5. BootStrap的栅格式布局

    1.栅格系统(布局) Bootstrap内置了一套响应式.移动设备优先的流式栅格系统,随着屏幕设备或视口(viewport)尺寸的增加,系统会自动分为最多12列. 我在这里是把Bootstrap中的栅 ...

  6. python 类C数组的两种形式：list -->内容可变, tuple --->内容不可变

    python 中的列表相当与 C 中的数组,列表:list 初始化使用[ ], 元组:tuple 初始化使用(): 一.列表list 1 #!/usr/bin/python  2   3 #list初 ...

  7. 墨仓式进入2.0时代？爱普生商用墨仓式L4158试用

    提起"墨仓式"打印机,相信现在已经没有人需要过多的解释,墨仓式打印机在打印市场占有率不断提高就是最佳佐证.为什么用户对于墨仓式这么认可,想必是墨仓式真正洞悉了他们的需求,解决了打印 ...

  8. 【K8S】基于单Master节点安装K8S集群

    写在前面 最近在研究K8S,今天就输出部分研究成果吧,后续也会持续更新. 集群规划 IP 主机名 节点 操作系统版本 192.168.175.101 binghe101 Master CentOS 8 ...

  9. CF1328E Tree Queries

    CF1328E Tree Queries 应该还是比较妙的 题意 给你一个树,然后多次询问 每次询问给出一堆节点,问你是否能找到一个从根出发的链,是的对于给出的每个节点,都能找出链上的点,是的他们的距 ...

  10. unittest 中的方法调用时报错 ValueError: no such test method in <class 'mytestcase.MyTestCase'>: runTest

    1.调用unittest中的方法时报错: ValueError: no such test method in <class 'mytestcase.MyTestCase'>: runTe ...