vue3 vue-router

最新推荐文章于 2024-07-16 17:24:37 发布

秋秋小事

最新推荐文章于 2024-07-16 17:24:37 发布

阅读量361

点赞数

分类专栏： Web前端面试笔记文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/jiaoyangdetian/article/details/130211168

版权

Web前端面试笔记专栏收录该内容

15 篇文章 0 订阅 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文深入探讨vue-router的三种模式：hash、history和abstract。讲解了hash模式利用location.hash实现原理，包括浏览器历史记录和hashchange事件的应用。接着分析了history模式依赖HTML5 History API，如何通过pushState和replaceState操作URL并监听popstate事件。最后提到了abstract模式，用于在非浏览器环境中使用。文章还简单提及了Vue3中vue-router的使用。

摘要由CSDN通过智能技术生成

vue-router的几种模式

vue-router 有 3 种路由模式：hash、history、abstract，对应的源码如下所示：

switch (mode) {
  case 'history':
    this.history = new HTML5History(this, options.base)
    break
  case 'hash':
    this.history = new HashHistory(this, options.base, this.fallback)
    break
  case 'abstract':
    this.history = new AbstractHistory(this, options.base)
    break
  default:
    if (process.env.NODE_ENV !== 'production') {
      assert(false, `invalid mode: ${mode}`)
    }
}