Vue Router 的 afterEach 钩子适合做什么，为什么它不能中断导航？
Vue Router 的 afterEach 钩子适合做什么，为什么它不能中断导航？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router afterEach 全局后置钩子 埋点 页面标题的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router afterEach 全局后置钩子 埋点 页面标题
面试知识索引 · 分类、标签与搜索
Vue面试题，180 道完整答案
Vue面试题第 1 页，显示第 1–50 题，共找到 180 道完整解析，可继续按分类、标签与关键词缩小范围。
180筛选结果
52技术分类
178检索标签
4索引分页
快速定位
清除全部筛选分类、标签与关键词搜索
第 1 页
本页面试问题
按稳定语义路径排序
- 0001
- 0002
首屏优化时，什么情况下应该用 Vue 异步组件延迟加载，什么情况下反而该保留同步引入？
首屏优化时，什么情况下应该用 Vue 异步组件延迟加载，什么情况下反而该保留同步引入？ 本文先给出可直接复述的结论，再用最小代码说明Vue 异步组件 首屏优化 按需加载 取舍的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue 异步组件 首屏优化 按需加载 取舍 - 0003
Vue 的 defineAsyncComponent 如何配置加载中与加载失败状态，delay 和 timeout 各解决什么问题？
Vue 的 defineAsyncComponent 如何配置加载中与加载失败状态，delay 和 timeout 各解决什么问题？ 本文先给出可直接复述的结论，再用最小代码说明Vue defineAsyncComponent loadingComponent errorComponent delay timeout的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue defineAsyncComponent loadingComponent errorComponent delay timeout - 0004
Vue 异步组件因网络波动加载失败后，如何实现自动重试？
Vue 异步组件因网络波动加载失败后，如何实现自动重试？ 本文先给出可直接复述的结论，再用最小代码说明Vue 异步组件 加载失败 重试 defineAsyncComponent loader的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue 异步组件 加载失败 重试 defineAsyncComponent loader - 0005
如何用 Vue Router 的组件内守卫实现表单未保存时离开页面的二次确认？
如何用 Vue Router 的组件内守卫实现表单未保存时离开页面的二次确认？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router beforeRouteLeave 表单未保存 离开确认的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router beforeRouteLeave 表单未保存 离开确认 - 0006
Vue 组合式函数怎样同时接收普通值、ref 和 getter 并保持追踪？
解释 MaybeRefOrGetter 与 toValue 的输入约定，说明为什么必须在 computed 或 watchEffect 内归一化读取，以及普通值快照、props getter 和函数值歧义。
核心关键词Vue 组合式函数 ref getter toValue 参数追踪 - 0007
Vue 组合式函数封装异步请求时，如何设计 loading、error、data 和竞态保护？
按请求身份设计异步状态，说明参数更新、错误重置、取消与过期结果保护，给出可注入加载器的实现，并区分首屏 SSR 数据与客户端请求封装。
核心关键词Vue 异步组合式函数 loading error data 请求竞态 - 0008
Vue 组合式函数里的生命周期钩子，为什么通常要在 setup 同步注册？
解释当前组件实例上下文如何决定钩子归属，区分同步注册和异步回调，并说明 script setup 顶层 await 的编译支持、SSR 与副作用清理。
核心关键词Vue 组合式函数生命周期 setup 同步注册与 await - 0009
Vue 组合式函数为什么用 use 命名，返回普通对象还是 reactive 对象？
解释 use 前缀的沟通作用、普通对象包 ref 的解构优势，以及 reactive 返回值、动作方法、初始参数和可写状态接口的取舍。
核心关键词Vue 组合式函数 use 命名与返回 refs 约定 - 0010
Vue 组合式函数为什么返回 readonly 状态，更新应该从哪里进行？
解释只读代理如何限制正常调用者直接写入，同时保留内部更新的可观察性；区分 readonly、快照、冻结和权限控制，并设计有校验的动作接口。
核心关键词Vue 组合式函数 readonly 返回状态与动作接口 - 0011
Vue 组合式函数的 ref 放在模块顶层和函数内部，共享范围有什么区别？
对比模块单例和每次调用创建的 ref，说明多组件隔离、应用级状态、SSR 请求污染、外部监听寿命及测试重置，避免把组合式函数误当作天然独立实例。
核心关键词Vue 组合式函数模块状态与实例状态共享范围 - 0012
在 Vue 组合式函数里注册事件监听或定时器，如何保证组件卸载后不泄漏？
在 Vue 组合式函数里注册事件监听或定时器，如何保证组件卸载后不泄漏？ 本文先给出可直接复述的结论，再用最小代码说明Vue 组合式函数 副作用清理 onUnmounted watch 停止的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue 组合式函数 副作用清理 onUnmounted watch 停止 - 0013
Vue 组合式函数怎样独立测试，什么时候仍需要挂载组件？
Vue 组合式函数怎样独立测试，什么时候仍需要挂载组件？ 本文先给出可直接复述的结论，再用最小代码说明Vue 组合式函数单元测试 effectScope 与组件宿主的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue 组合式函数单元测试 effectScope 与组件宿主 - 0014
Vue 组合式函数相比 mixin，具体改善了哪些复用问题？
Vue 组合式函数相比 mixin，具体改善了哪些复用问题？ 本文先给出可直接复述的结论，再用最小代码说明Vue 组合式函数与 mixin 来源冲突隐式依赖对比的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue 组合式函数与 mixin 来源冲突隐式依赖对比 - 0015
Vue 共享逻辑用组合式函数，跨层状态什么时候用 provide/inject？
Vue 共享逻辑用组合式函数，跨层状态什么时候用 provide/inject？ 本文先给出可直接复述的结论，再用最小代码说明Vue composable 参数传递与 provide inject 选型的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue composable 参数传递与 provide inject 选型 - 0016
Vue Router 在组合式 API 中如何使用组件内守卫，同一路由组件参数变化复用时该用哪个钩子？
Vue Router 在组合式 API 中如何使用组件内守卫，同一路由组件参数变化复用时该用哪个钩子？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router onBeforeRouteUpdate onBeforeRouteLeave 组合式 API的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router onBeforeRouteUpdate onBeforeRouteLeave 组合式 API - 0017
Vue 项目里路由懒加载的分包如何通过 prefetch 或 preload 提前获取而不阻塞首屏？
Vue 项目里路由懒加载的分包如何通过 prefetch 或 preload 提前获取而不阻塞首屏？ 本文先给出可直接复述的结论，再用最小代码说明Vue 懒加载 webpackPrefetch webpackPreload 预取 分包的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue 懒加载 webpackPrefetch webpackPreload 预取 分包 - 0018
Vue Router 守卫里做 token 校验这类异步鉴权时，如何避免页面闪现或守卫被绕过？
Vue Router 守卫里做 token 校验这类异步鉴权时，如何避免页面闪现或守卫被绕过？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router 守卫 异步鉴权 token 校验 return false的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router 守卫 异步鉴权 token 校验 return false - 0019
Vue Router 的全局前置守卫里做登录重定向时，为什么会出现无限循环跳转，如何避免？
Vue Router 的全局前置守卫里做登录重定向时，为什么会出现无限循环跳转，如何避免？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router 重定向 无限循环 beforeEach 登录的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router 重定向 无限循环 beforeEach 登录 - 0020
被 Vue KeepAlive 缓存的组件为什么 mounted 只执行一次，数据刷新应该放在哪个生命周期？
被 Vue KeepAlive 缓存的组件为什么 mounted 只执行一次，数据刷新应该放在哪个生命周期？ 本文先给出可直接复述的结论，再用最小代码说明Vue KeepAlive activated deactivated 生命周期 数据刷新的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue KeepAlive activated deactivated 生命周期 数据刷新 - 0021
运行中动态增删需要缓存的 Vue 组件时，include 绑定响应式数组有什么注意事项？
运行中动态增删需要缓存的 Vue 组件时，include 绑定响应式数组有什么注意事项？ 本文先给出可直接复述的结论，再用最小代码说明Vue KeepAlive include 响应式 动态缓存 数组的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue KeepAlive include 响应式 动态缓存 数组 - 0022
Vue KeepAlive 的 include/exclude 匹配依据是什么，为什么常出现配置后不生效的问题？
Vue KeepAlive 的 include/exclude 匹配依据是什么，为什么常出现配置后不生效的问题？ 本文先给出可直接复述的结论，再用最小代码说明Vue KeepAlive include exclude 组件 name 匹配 不生效的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue KeepAlive include exclude 组件 name 匹配 不生效 - 0023
Vue KeepAlive 的 max 属性触发淘汰时按什么规则移除缓存实例，设置时要权衡什么？
Vue KeepAlive 的 max 属性触发淘汰时按什么规则移除缓存实例，设置时要权衡什么？ 本文先给出可直接复述的结论，再用最小代码说明Vue KeepAlive max LRU 淘汰 内存 权衡的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue KeepAlive max LRU 淘汰 内存 权衡 - 0024
如何实现列表页进入详情后返回时保留滚动位置，而从其他页面进入列表时重新加载的 KeepAlive 缓存策略？
如何实现列表页进入详情后返回时保留滚动位置，而从其他页面进入列表时重新加载的 KeepAlive 缓存策略？ 本文先给出可直接复述的结论，再用最小代码说明Vue KeepAlive 路由 meta 动态缓存 列表 滚动位置的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue KeepAlive 路由 meta 动态缓存 列表 滚动位置 - 0025
使用 Vue KeepAlive 后表单残留或数据过期，如何定位是缓存导致并选择刷新手段？
使用 Vue KeepAlive 后表单残留或数据过期，如何定位是缓存导致并选择刷新手段？ 本文先给出可直接复述的结论，再用最小代码说明Vue KeepAlive 数据过期 表单残留 缓存 刷新 key的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue KeepAlive 数据过期 表单残留 缓存 刷新 key - 0026
Vue Router 的 router.push 返回的导航结果如何区分重复导航、被中止和被取消？
Vue Router 的 router.push 返回的导航结果如何区分重复导航、被中止和被取消？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router 导航失败 isNavigationFailure NavigationFailureType的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router 导航失败 isNavigationFailure NavigationFailureType - 0027
Vue Router 在一次导航中，全局守卫、路由独享守卫和组件内守卫的完整执行顺序是什么？
Vue Router 在一次导航中，全局守卫、路由独享守卫和组件内守卫的完整执行顺序是什么？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router 导航守卫 执行顺序 beforeEach beforeEnter beforeRouteEnter的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router 导航守卫 执行顺序 beforeEach beforeEnter beforeRouteEnter - 0028
Pinia 的 action 中处理异步请求与业务错误，推荐怎样的组织方式？
Pinia 的 action 中处理异步请求与业务错误，推荐怎样的组织方式？ 本文先给出可直接复述的结论，再用最小代码说明Pinia action 异步 错误处理 async await的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia action 异步 错误处理 async await - 0029
Pinia 的 getter 需要接收参数时为什么要返回一个函数，这样做会失去什么能力？
Pinia 的 getter 需要接收参数时为什么要返回一个函数，这样做会失去什么能力？ 本文先给出可直接复述的结论，再用最小代码说明Pinia getter 传参 返回函数 缓存失效的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia getter 传参 返回函数 缓存失效 - 0030
Pinia 如何配置才能让 store 在 Vite 热更新时保留状态？
Pinia 如何配置才能让 store 在 Vite 热更新时保留状态？ 本文先给出可直接复述的结论，再用最小代码说明Pinia HMR 热更新 import.meta.hot acceptHMRUpdate的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia HMR 热更新 import.meta.hot acceptHMRUpdate - 0031
如何用 Pinia 插件机制给 store 增加本地持久化能力？
如何用 Pinia 插件机制给 store 增加本地持久化能力？ 本文先给出可直接复述的结论，再用最小代码说明Pinia 插件 持久化 localStorage $subscribe的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia 插件 持久化 localStorage $subscribe - 0032
Pinia 的 Setup Store 没有内置 $reset，应该如何实现状态重置？
Pinia 的 Setup Store 没有内置 $reset，应该如何实现状态重置？ 本文先给出可直接复述的结论，再用最小代码说明Pinia setup store $reset 状态重置 实现的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia setup store $reset 状态重置 实现 - 0033
Pinia 的 Setup Store 与 Options Store 两种写法分别在什么场景下更合适？
Pinia 的 Setup Store 与 Options Store 两种写法分别在什么场景下更合适？ 本文先给出可直接复述的结论，再用最小代码说明Pinia setup store options store 写法 选择的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia setup store options store 写法 选择 - 0034
解构 Pinia store 时为什么要用 storeToRefs，直接解构会丢失什么？
解构 Pinia store 时为什么要用 storeToRefs，直接解构会丢失什么？ 本文先给出可直接复述的结论，再用最小代码说明Pinia storeToRefs 解构 响应式丢失的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia storeToRefs 解构 响应式丢失 - 0035
在路由守卫或工具函数这类组件外环境使用 Pinia store，为什么必须显式传入 pinia 实例？
在路由守卫或工具函数这类组件外环境使用 Pinia store，为什么必须显式传入 pinia 实例？ 本文先给出可直接复述的结论，再用最小代码说明Pinia 组件外使用 useStore 传 pinia 实例 路由守卫的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia 组件外使用 useStore 传 pinia 实例 路由守卫 - 0036
Pinia 相比 Vuex 在 API 设计上做了哪些取舍，为什么取消 mutation？
Pinia 相比 Vuex 在 API 设计上做了哪些取舍，为什么取消 mutation？ 本文先给出可直接复述的结论，再用最小代码说明Pinia Vuex 区别 取消 mutation 设计动机的工作方式、判断依据、项目边界和常见误区。
核心关键词Pinia Vuex 区别 取消 mutation 设计动机 - 0037
Vue Router 的路由懒加载如何通过动态 import 实现，如何控制打包产物按路由分组？
Vue Router 的路由懒加载如何通过动态 import 实现，如何控制打包产物按路由分组？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router 路由懒加载 动态 import 代码分割 chunk的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router 路由懒加载 动态 import 代码分割 chunk - 0038
如何用 Vue Router 的 meta 字段配合全局守卫实现基于角色的页面权限控制？
如何用 Vue Router 的 meta 字段配合全局守卫实现基于角色的页面权限控制？ 本文先给出可直接复述的结论，再用最小代码说明Vue Router meta 权限 角色 路由守卫 设计的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Router meta 权限 角色 路由守卫 设计 - 0039
Vue SSR 应用里需要访问 window 或 localStorage 时，代码应该放在哪里才不会在服务端报错？
Vue SSR 应用里需要访问 window 或 localStorage 时，代码应该放在哪里才不会在服务端报错？ 本文先给出可直接复述的结论，再用最小代码说明Vue SSR window localStorage onMounted 客户端判断的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue SSR window localStorage onMounted 客户端判断 - 0040
Vue SSR 中为什么每个请求都要创建新的应用实例和 store，否则会出什么问题？
Vue SSR 中为什么每个请求都要创建新的应用实例和 store，否则会出什么问题？ 本文先给出可直接复述的结论，再用最小代码说明Vue SSR 跨请求状态污染 应用实例 工厂函数的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue SSR 跨请求状态污染 应用实例 工厂函数 - 0041
Vue SSR 的服务端预取数据如何传递到客户端并避免重复请求？
Vue SSR 的服务端预取数据如何传递到客户端并避免重复请求？ 本文先给出可直接复述的结论，再用最小代码说明Vue SSR 数据预取 状态注水 serverPrefetch Pinia的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue SSR 数据预取 状态注水 serverPrefetch Pinia - 0042
Vue SSR 中 hydration 不匹配报错的常见原因有哪些，如何定位？
Vue SSR 中 hydration 不匹配报错的常见原因有哪些，如何定位？ 本文先给出可直接复述的结论，再用最小代码说明Vue SSR hydration mismatch 不匹配 排查的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue SSR hydration mismatch 不匹配 排查 - 0043
Vue 应用做 SSR 时哪些生命周期钩子会在服务端执行，这对代码编写有什么约束？
Vue 应用做 SSR 时哪些生命周期钩子会在服务端执行，这对代码编写有什么约束？ 本文先给出可直接复述的结论，再用最小代码说明Vue SSR 生命周期 服务端执行 beforeCreate created setup的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue SSR 生命周期 服务端执行 beforeCreate created setup - 0044
面对一个内容型站点与一个强交互后台，分别该选 Vue 的 SSR、SSG 还是纯 CSR，判断依据是什么？
面对一个内容型站点与一个强交互后台，分别该选 Vue 的 SSR、SSG 还是纯 CSR，判断依据是什么？ 本文先给出可直接复述的结论，再用最小代码说明Vue SSR SSG CSR 渲染模式 选型 依据的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue SSR SSG CSR 渲染模式 选型 依据 - 0045
Vue 的 Suspense 如何协调多个异步组件和 setup 中的异步依赖，与 defineAsyncComponent 是什么关系？
Vue 的 Suspense 如何协调多个异步组件和 setup 中的异步依赖，与 defineAsyncComponent 是什么关系？ 本文先给出可直接复述的结论，再用最小代码说明Vue Suspense 异步依赖 async setup defineAsyncComponent 关系的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Suspense 异步依赖 async setup defineAsyncComponent 关系 - 0046
Vue 应用级 provide 与组件级 provide 的生效范围有何区别？
Vue 应用级 provide 与组件级 provide 的生效范围有何区别？ 本文先给出可直接复述的结论，再用最小代码说明Vue app.provide 全局注入的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue app.provide 全局注入 - 0047
Vue 中 defineAsyncComponent 如何实现组件的按需加载？
Vue 中 defineAsyncComponent 如何实现组件的按需加载？ 本文先给出可直接复述的结论，再用最小代码说明Vue defineAsyncComponent 异步组件的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue defineAsyncComponent 异步组件 - 0048
Vue 中未声明的属性和事件监听器会怎样透传？
Vue 中未声明的属性和事件监听器会怎样透传？ 本文先给出可直接复述的结论，再用最小代码说明Vue attrs 属性透传与事件监听器继承的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue attrs 属性透传与事件监听器继承 - 0049
Vue 3 的 Block Tree 如何配合 Patch Flag 缩小动态节点的比对范围？
Vue 3 的 Block Tree 如何配合 Patch Flag 缩小动态节点的比对范围？ 本文先给出可直接复述的结论，再用最小代码说明Vue Block Tree 动态节点收集的工作方式、判断依据、项目边界和常见误区。
核心关键词Vue Block Tree 动态节点收集 - 0050
Vue Boolean prop 的缺省值、空字符串和 false 分别如何转换？
解释 Vue 布尔 prop 的特殊转换，区分静态 false 字符串与动态布尔值，并核对 String 和 Boolean 联合类型的排列顺序、默认值及实际组件结果。
核心关键词Vue Boolean prop 缺省空字符串与类型顺序