首页 > 其他分享 >路由原理hash和history

路由原理hash和history

时间:2022-11-19 08:56:09浏览次数:49  
标签:about http 模式 xx hash 路由 history

hash和history都是运用于前后端项目分离的

要清楚两者的区别以及两者各自的使用场景,还有各自的使用特点和优缺点

hash是由#后面拼接的真实url路径

history是h5新增的特性

 hash // 浏览器里的形态:http://xx.com/#/about

 history // 浏览器里的形态:http://xx.com/about

const router = createRouter({

           history: createWebHashHistory(), // hash模式

          history: createWebHistory(), // history模式

     })

vue-router    主要有两种模式:主要有hash和history模式

差别主要在形式上,SEO和部署上的差别:

hash模式在地址栏上的形式,不会被搜索引擎处理

但history模式运用在大部分的web项目中,服务器要做回退处理,不然刷新是会出现404

标签:about,http,模式,xx,hash,路由,history
From: https://www.cnblogs.com/bjyx-805105/p/16905413.html

相关文章

  • Redis学习(四)之redis中的数据类型之Hashes类型
      1、hset设置值,hget获取值,hmget可以一次获取一个map的多个key值。 2、hsetmapnamekeyvaluekeyvalue  一些指令可以直接操作map中的key对应的value值 ......
  • 一致性hash算法
    1、场景描述1.1需求  假设,我们有三台缓存服务器,有3万张图片需要缓存,希望这些图片被均匀的缓存到这3台服务器上,以便它们能够分摊缓存的压力,即我们希望每台服务器......
  • 通过代码跳转路由
    <template><divid="app"><button@click="toHome">首页</button><buttonto="/about"@click="toAbout">关于</button><!--相当于占位符--><r......
  • 复杂路由
    一、嵌套路由:可在单页应用框架下开发多页应用。思想:嵌套路由其实是router-view的细化,router-view第一层中包含一个router-view,路由children路由。每一个坑挖好都要对......
  • router-link 路由参数
    1、路由信息对象:通过this.$route可获取组件的配置路由的对象,只读对象。  2、路由操作对象:通过this.$router可获取路由对象,也就是VueRouter,只写对象。 3、路由......
  • vue 路由传参
    1.路由传参两种方式params方式query方式 params方式需要占位   query方式不需要 ......
  • 使用路由元信息 全局控制显示隐藏路由组件
    1.在路由中配置自定义属性  2.在使用页面组件中 用$route.meta.show 是否为true判断组件显示或隐藏下面为例      3.示例 ......
  • 前端路由的原理
    1、window.onhashchange(监听URLhash):当一个窗口的hash(URL中#后面的部分)的改变时就会触发hashchange事件。2、在hashchange 事件中匹配URL,存在则加载对应的DOM元......
  • [笔记]前端路由的两种模式
    参考资料:https://juejin.cn/post/7127143415879303204#heading-11https://blog.csdn.net/qq_28641023/article/details/120328826理解单页面应用单页面应用是指我......
  • HashMap面试题(二)
    HashMap面试题(二)目录HashMap面试题(二)一、HashMap中如何计算数组下标的二、JDK1.7中rehash的底层是怎样实现的initHashSeedAsNeeded方法Holder方法三、HashMap中的modC......