vue中history和hash的区别有哪些

本篇内容主要讲解“vue中history和hash的区别有哪些”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“vue中history和hash的区别有哪些”吧!

成都创新互联始终坚持【策划先行，效果至上】的经营理念，通过多达10余年累计超上千家客户的网站建设总结了一套系统有效的全网推广解决方案，现已广泛运用于各行各业的客户，其中包括：假山制作等企业，备受客户赞许。

区别：1、hash路由再地址栏URL上有“#”，而history路由没有；2、进行回车刷新操作时，hash路由会加载到地址栏对应的页面，而history路由一般会出现404错误；3、hash支持一些低版本的浏览器，而history不支持。

本文操作环境：windows10系统、Vue2.9.6版，DELL G3电脑。

vue中history和hash的区别

• 1.hash路由在地址栏URL上有#，用 window.location.hash 读取。而history路由没有会好看一点

• 2.我们进行回车刷新操作，hash路由会加载到地址栏对应的页面，而history路由一般就404报错了（刷新是网络请求，没有后端准备时会报错）。

• 3.hash路由支持低版本的浏览器，而history路由是HTML5新增的API。

• 4.hash的特点在于它虽然出现在了URL中，但是不包括在http请求中，所以对于后端是没有一点影响的，所以改变hash不会重新加载页面，所以这也是单页面应用的必备。

• 5.history运用了浏览器的历史记录栈，之前有back,forward,go方法，之后在HTML5中新增了pushState（）和replaceState（）方法，它们提供了对历史记录进行修改的功能，不过在进行修改时，虽然改变了当前的URL，但是浏览器不会马上向后端发送请求。

• 6.history的这种模式需要后台配置支持。比如：当我们进行项目的主页的时候，一切正常，可以访问，但是当我们刷新页面或者直接访问路径的时候就会返回404，那是因为在history模式下，只是动态的通过js操作window.history来改变浏览器地址栏里的路径，并没有发起http请求，但是当我直接在浏览器里输入这个地址的时候，就一定要对服务器发起http请求，但是这个目标在服务器上又不存在，所以会返回404

到此，相信大家对“vue中history和hash的区别有哪些”有了更深的了解，不妨来实际操作一番吧！这里是创新互联网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！