Vue 查漏补缺系列

设计思路一： 使用 Vue Router 的组件钩子： Vue Router 提供了在路由切换时触发的钩子，如 beforeRouteLeave 和 beforeRouteEnter，这可以帮助我们在

在 Vue 项目中，封装 axios 是一种常见的做法，用于统一管理 API 请求逻辑、配置全局拦截器和处理通用功能。这种封装不仅可以提高代码的复用性，还能便于管理和调试。 1. 为什么要封装 axi

Vue 的 diff 算法 是其虚拟 DOM 更新的核心机制，用于高效比较新旧虚拟 DOM 树并应用最小更新到真实 DOM。Vue 2 和 Vue 3 在 diff 算法上有显著差异。 一、Vue d

Vuex 和 localStorage / sessionStorage 的区别 特性 Vuex localStorage sessionStorage 存储位置 内存中（默认情况下刷新页面丢失） 浏

在 Vuex 中，核心概念包括 State、Getter、Mutation、Action 和 Module。这些概念对应了 Vuex 的几种属性或功能： State（状态） 作用：存储应用的全局数据，

在 Vuex 中，mutations 和 actions 都是用于修改 store 中状态（state）的方法，但它们之间是有操作区别的： Mutations 同步操作：mutations 必须进行同

Vuex 和 Pinia 是 Vue.js 应用中常用的状态管理库，它们的核心原理是管理共享状态，并提供一种在组件间高效传递和更新状态的方法。以下是它们的原理和对比，以及我的理解： Vuex 的原理

1. 概述 名称 $route $router 含义 当前活跃路由的对象，包含与路由相关的信息（只读）。 路由实例对象，包含导航的方法和全局路由配置。 类型 是一个路由对象，表示当前路由的状态和信息。

1. 核心区别 Vue Router 路由跳转 基于前端路由（SPA 单页应用） ： 仅改变 URL 地址，不刷新页面。 Vue Router 的跳转会动态加载相应的组件，而无需重新加载整个页面资源（

综合执行顺序 假设从 A 路由 导航到 B 路由，以下是完整的执行顺序： 1. 从 A 路由离开 router.beforeEach（全局前置守卫） beforeRouteLeave（组件内守卫，A

Vue Router 提供了多种 路由导航守卫，用于控制导航行为、权限校验、数据预加载等操作。导航守卫按触发时机和作用范围分类，主要有以下几类： 1. 全局守卫 这些守卫会在每次路由发生变化时触发，适

在 Vue 中，params 和 query 是两种常见的参数传递方式，它们在使用方式、表现形式、灵活性和适用场景上有显著的区别。以下是详细对比： params（路径参数） 用途：params 通常用

在 Vue-Router 中，History 模式和Hash 模式是两种常见的路由实现方式。它们的主要区别在于实现原理和 URL 表现形式： 1. Hash 模式 实现原理 基于浏览器的 hashch

前端路由的基本概念 定义：前端路由是一种在单页应用（SPA）中管理视图切换的机制。在传统的多页应用中，页面之间的切换是通过服务器返回不同的 HTML 页面来实现的。而在 SPA 中，整个应用只有一个

在 Vue 中，keep-alive 是一个特殊的组件，用于缓存组件实例以优化性能。它与 Vue 的生命周期有特殊的交互关系，尤其是在组件的创建和销毁流程中。 keep-alive 和 Vue 生命周

created和mounted的区别 执行时机： created钩子：在 Vue 实例创建完成后被调用。此时，组件的数据已经完成响应式处理，这意味着可以访问和操作data中的数据以及methods中的

在 Vue 的生命周期中，父组件和子组件的钩子函数的执行顺序类似于js事件的冒泡和捕获顺序 1. 挂载阶段（组件创建并插入 DOM） 当父组件和子组件一起加载时： 父组件的 beforeCreate

1、Vue 的生命周期（生命周期钩子） Vue 的生命周期是指从组件创建到销毁的过程，它会触发一系列钩子函数。以下是 Vue 生命周期的阶段及对应钩子函数： 1. 创建阶段 beforeCreate

Vue 的服务器端渲染（SSR，Server-Side Rendering）是一种在服务器端生成 HTML 的技术，它将客户端 Vue 组件渲染为 HTML 字符串并发送到浏览器。SSR 与传统的客户

在 Vue.js 中，模板 (template) 会被转换成渲染函数 (render function)，从而生成虚拟 DOM (Virtual DOM)。这个过程包括以下几个关键步骤： 1. 模板编