vue hash和 history 的理解

最新推荐文章于 2024-04-29 16:15:35 发布
最新推荐文章于 2024-04-29 16:15:35 发布
阅读量249 收藏
点赞数
分类专栏： vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/whyasdfghjkl/article/details/108248541
版权

区别：
1）hash模式url带#号，history模式不带#号
2）如果考虑url的规范，那么就需要使用history模式，因为history模式没有#号，是个正常的url，适合开发习惯
3）把用Vue或者React=做的页面分享至三方app，有的app里面url是不允许带有#号的，所以要将#号去除那么就要使用history模式
4）使用history模式还有一个问题就是，在访问二级页面的时候，做刷新操作，会出现404错误，那么就需要和后端人员配合让他配置一下apache或是nginx的url重定向，重定向到你的首页路由

whyasdfghjkl
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue-router中的hash和history两种模式的区别
10-18
大家都知道vue-router有两种模式，hash模式和history模式，这里来谈谈vue-router中的hash和history两种模式的区别。感兴趣的朋友一起看看吧
vue-router中Hash模式和History模式
老电影故事的博客
10-29 7874
vue-router 中hash模式和history模式 在vue的路由配置中有mode选项，最直观的区别就是在url中hash 带了一个很丑的 # ，而history是没有#的。vue默认使用hash。 从用户角度看 前端路由实现了两个功能（使用ajax更新页面状态的情况下） 1、记录当前页面的状态（保存或分享当前页的url，再次打开该url时，网页还是保存的（分享）时的状态）； 2、可是使用浏览器的前进后退功能（如点击后退按钮，可以使页面回到ajax更新页面之前的状态，url也回到之前的状态） 作为开
Vue路由模式：hash和history
月光晒了很凉快的博客
09-17 3157
路由的本质就是一种对应关系，根据不同的URL请求，返回对应不同的资源。那么url地址和真实的资源之间就有一种对应的关系，就是路由。SPA(Single Page Application)单页面应用程序,基于前端路由而起：整个网站只有一个页面，通过监听地址栏中的变化事件，来通过Ajax局部更新内容信息显示、同时支持浏览器地址栏的前进和后退操作。前端路由有两种模式：hash 模式和 history 模式。概述：hash 路由模式是这样的：。 有带号，后面就是 hash 值的变化。改变后面的 hash 值，它不会
Vue进阶（七十七）：vue 路由的两种模式：hash与history_vue创建中的history
最新发布
2401_84447233的博客
04-29 852
一、为了达到这个目的，浏览器提供了hash与history两种支持：为什么这两种模式实现了？hashURLhashhash#/hellohashURLHTTPhashhistory这两个方法应用于浏览器的历史记录栈，在当前已有的backforwardgo基础上，它们提供了对历史记录进行修改的功能。只是当它们执行修改时，虽然改变了当前的URL，但浏览器不会立即向后端发送请求。history模式，会出现404 的情况，需要后台配置。
浅析Vue前端路由中 hash 与 history的区别
qq_43067585的博客
08-26 393
Vue前端路由hash与history间有什么区别？下面本篇文章就来了解一下前端路由 hash 与 history 的差异，希望对大家有所帮助！
一文了解vue-router之hash模式和history模式
10-16
本文的主题是关于Vue.js中用于前端路由管理的库vue-router的两种路由模式：hash模式和history模式。它们是vue-router提供的两种主要的导航方式，各有特点，适用于不同的场景和需求。 首先，让我们详细了解一下hash...
区分vue-router的hash和history模式
10-14
Vue Router 是 Vue.js 应用中的官方路由库，它提供了两种模式...总的来说，Vue Router 的 hash 和 history 模式各有优劣，理解它们的工作原理和适用场景，可以帮助开发者做出最佳选择，以构建高效、用户体验优秀的SPA。
vue vue-Router默认hash模式修改为history需要做的修改详解
10-18
Vue.js 是一款流行的前端框架，而 Vue Router 是官方推荐的路由管理库，它提供了两种主要的导航解析模式：Hash 模式和 History 模式。本文将详细介绍如何将 Vue Router 的默认 Hash 模式修改为 History 模式，并解决...
vue中hash和history区别
qq_51441779的博客
08-08 972
vue中hash和history区别
vue3 路由hash与History的设置
john987321456的博客
02-16 7071
一、history 关键字：createWebHistory import { createRouter, createWebHistory } from 'vue-router' const routes = [ { path: '/userinfo', name: 'UserInfo', component: () => import('../views/UserInfo.vue') }] const router = createRouter({ history: createW
vue-cli在 history模式下的配置详解
10-15
主要介绍了vue-cli在 history模式下的配置详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue中hash和history的区别
水壶要大的博客
07-03 9405
vue的路由分为hash和history模式，他俩最直观的区别就是hash路由有一个 # 号，而history是没有的。还有就是: 1. hash支持低版本的浏览器，而history就没有那么友好了 2. (1) hash模式下，它指 # 号之后的所有字符，但是他虽然包含在url中，但是不包含在http请求中。所以改变hash值不会重新加载页面，对传给后端的url没有任何影响，因此不会重新加载页面。它每次改变都会触发hashchange事件，可以通过给window加上hashchang...
vue实战(2)——vue实战项目history模式下去#具体流程详解（一）
weixin_34248118的博客
09-12 125
一、具体实现步骤 nginx.conf配置 server { listen 80; server_name localhost; location / { proxy_pass http://localhost:8000; } error_page 500 502 503 504 /50x.html; location =...
Vue中hash模式和history模式的区别
h5jqd的博客
11-15 256
hash模式是依靠onhashchange事件(监听location.hash的改变)，而history模式是主要是依靠的HTML5 history中新增的两个方法，pushState()可以改变url地址且不会发送请求，replaceState()可以读取历史记录栈,还可以对浏览器记录进行修改。当真正需要通过URL向后端发送HTTP请求的时候，比如常见的用户手动输入URL后回车，或者是刷新(重启)浏览器，这时候history模式需要后端的支持。)，如果后端没有对这个路径做处理的话，就会返回404错误。
vue中的history和hash
热门推荐
qq_41022291的博客
03-20 1万+
参考文档（技术博客支持原创作者分享，尊重别人的劳动成果） 此文档为技术总结，不属于该UP主原创 https://blog.csdn.net/lyn1772671980/article/details/80804419 https://www.jb51.net/article/143923.htmhttps://router.vuejs.org/zh/guide/essentials/hist...
Vue3.0路由将哈希(hash)更改为历史(history)模式
IU
04-03 1165
Vue3.0路由将哈希(hash)更改为历史(history)模式
vue路由器的两种工作模式：hash模式和history模式
weixin_51747462的博客
08-12 2760
hash模式和history模式的区别
vue路由的两种模式--hash和history
一个憨憨的前端之路
08-24 3166
  大家都知道在vueRouter中，我们可以通过mode来改变路由模式，可选为hash和history。 hash   hash指的是location里面#以及它后面的部分。也被成为锚点，通常用来定位，它的改变不会造成页面的刷新。   我们可以通过window.location.hash来获取当前的hash值。 ** 拓展：url各部分获取 ** hash 设置或返回从井号 (#) 开始的 URL（锚）。 host 设置或返回主机名和当前 URL 的端口号。 hostname 设置或返回当前 URL 的主
vue hash和history的区别
03-17
vue中hash和history模式的区别在于URL中的显示方式不同。 - hash模式: URL中会出现#符号，如http://example.com/#/about。这种模式不会向服务器发送请求，而是在客户端进行处理。 - history模式: URL中不会出现#...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值