Vue 相关技术文章

php mysql shell go vue css api接口对接支付接口对接

Vue 3.6 的 Vapor 不再默认把事件委托到 document：祖先 stopPropagation 不再吃掉子元素的处理函数

Vue 3.6 的 Vapor 不再默认把事件委托到 document：祖先 stopPropagation 不再吃掉子元素的处理函数
2026-11-04 21:05:00
Vue 3.6 RC 里 Vapor 的三处行为差异：事件委托改成 opt-in（要 .delegate 才回到旧行为）、slots.default() 会真的渲染不能当探测、自定义指令变成函数加 getter。附 Vapor 不支持 API 清单与 createVaporApp / interop 的取舍。
Vue 前端 Vapor 迁移

组件粒度别按行数拆：一个下拉开出四个组件，小红点却留在 Badge 里

组件粒度别按行数拆：一个下拉开出四个组件，小红点却留在 Badge 里
2026-11-03 00:04:12
Ant Design 的 Select 在 headless 层拆成 Root/Trigger/Value/Content/Item，Badge 的小红点却一直是内部实现。本文用 Event/Props/Expose/Context 四条信息通路（外加 Feedback 例外）给出可执行的组件粒度判据，附 Switch、Select、Caret 的判定过程、Vue 代码对照，以及「只有转发 props」这种拆早了的信号。
组件粒度组件设计前端工程 Vue React Headless UI

beforeEnter 在 /users/2 → /users/3 时不触发：导航守卫 12 步顺序与三个边界

beforeEnter 在 /users/2 → /users/3 时不触发：导航守卫 12 步顺序与三个边界
2026-11-03 00:03:56
导航守卫真正难的不是记钩子名，而是 12 步执行顺序和触发边界：beforeEnter 在 /users/2 → /users/3 这种参数变化时根本不执行；数据请求该放 beforeResolve 而不是 afterEach；返回值 false、路由地址、true 的语义与 next 三态等价表；异步守卫挂起期间 URL 与视图不一致、return false 时 URL 回滚的原因。附自检清单。
导航守卫 Vue Router 前端路由

Nuxt 5 迁移：Options API 被编译出客户端包、路由默认区分大小写、server/utils 子目录不再自动导入

Nuxt 5 迁移：Options API 被编译出客户端包、路由默认区分大小写、server/utils 子目录不再自动导入
2026-11-02 21:06:40
Nuxt 5 迁移里不报错但改变运行路径的默认值：Options API 被编译出客户端包、路由默认区分大小写且 sensitive 只能写在 nuxt.config、server/utils 子目录不再自动导入、clearNuxtState 改重置初始值、顶层 await navigateTo 后续代码不执行等。每条附排查 grep 与改造方式。
Nuxt Vue 前端迁移 Node.js 自动导入

Vue Router 5.4.0：hash 不再解码，重定向不再继承 params/query/hash

Vue Router 5.4.0：hash 不再解码，重定向不再继承 params/query/hash
2026-11-01 21:08:00
Vue Router 5.4.0 的几处默认行为变化会直接打断现有代码：hash 段不再解码、只做保护性编码；重定向不再隐式继承 params/query/hash；带默认值的 query 参数 push 时可省略，required 与 default 不能并存；滚动恢复默认行为有变。附逐条自查清单。
Vue 前端路由升级

Vue 3.6 Vapor 在 Nuxt 4.6 只能 interop：开启方式、限制清单与实测数字

Vue 3.6 Vapor 在 Nuxt 4.6 只能 interop：开启方式、限制清单与实测数字
2026-11-01 21:03:15
Vue 3.6 的 Vapor Mode 是可选编译模式，跳过虚拟 DOM；在 Nuxt 4.6 里只能以 interop 形式用，应用根仍留在 VDOM。整理开启配置、Vue 版本要求、Nuxt 文档列出的六条限制（$el、Island slot、keyed onPrehydrate、defineNuxtComponent 等）与构建性能数字。
Vue Nuxt 前端编译优化

onUpdated 的四个坑：一次渲染只触发一次、父钩子晚于子钩子、改状态成环、SSR 不执行

onUpdated 的四个坑：一次渲染只触发一次、父钩子晚于子钩子、改状态成环、SSR 不执行
2026-10-31 00:05:37
Vue 3 的 onUpdated 对齐的是渲染轮次，不是 ref 赋值次数：多个状态变更合并成一轮、只改子组件内部状态时父钩子根本不跑、写回被模板读取的状态会成环、SSR 首屏完全不触发。按官方文档给出 nextTick、watch flush:post、onBeforeUpdate 的替代判据。
onUpdated Vue3 Vue 生命周期钩子

Element-Plus-X：给 Vue 3 + Element Plus 补一套 AI 聊天组件，以及 useXStream 的 SSE 解析细节

Element-Plus-X：给 Vue 3 + Element Plus 补一套 AI 聊天组件，以及 useXStream 的 SSE 解析细节
2026-10-29 21:31:45
Element-Plus-X 是基于 Vue 3 + Element Plus 的 AI 组件库，提供 BubbleList、XSender、ThoughtChain 等对话组件，以及 useXStream 流式请求 hook。本文按组件清单、安装方式、useXStream 的 startStream/cancel/data 签名与 SSE 默认解析规则（\n\n 分条、data: 前缀、[DONE] 兜底）梳理接入要点，并记录协议支持与 CDN 引入两条已知边界。
Vue 3 Element Plus AI 组件 SSE 流式请求

Vue 3 纯前端 PDF 工具站上线：8 个坑，从 80MB 白屏到只收录首页

Vue 3 纯前端 PDF 工具站上线：8 个坑，从 80MB 白屏到只收录首页
2026-10-29 21:31:13
一个纯浏览器端 Vue 3 PDF 工具站的上线复盘：pdf-lib 处理 80MB 文件白屏、Web Worker 结构化克隆比主线程还慢、批量进度条在 ZIP 阶段撒谎，以及 Playwright 预渲染后 canonical 仍指向首页、Cloudflare Pages 308 导致 Googlebot 报错的排查过程，附可直接复用的代码。
Vue 3 pdf-lib Web Worker 预渲染 SEO

Vite 8 升级核对清单：CJS default 导入和 browser/module 嗅探会先坏

Vite 8 升级核对清单：CJS default 导入和 browser/module 嗅探会先坏
2026-10-29 20:04:53
Vite 8 用 Rolldown + Oxc 取代 esbuild + Rollup，升级真正花时间的是语义变化：CJS 的 default 导入统一成一套规则（以前 dev 和 build 判断条件不同）、browser/module 字段的内容嗅探被移除、manualChunks 对象形式与 watch.chokidar 失效。按「哪类项目会先坏」列出核对项，含配置改名映射、没有等价物的 esbuild 选项、build() 抛 BundleError 等，以及先用 rolldown-vite 隔离问题的迁移路径。
Vite Rolldown 前端构建升级迁移 Vue

Vue 3.6 RC 把异步组件的 200ms 延迟加回来了：loading 闪一下到底该谁管

Vue 3.6 RC 把异步组件的 200ms 延迟加回来了：loading 闪一下到底该谁管
2026-10-26 21:05:48
v3.6.0-rc.13 恢复了异步组件默认 200ms 延迟：loader 在窗口内 resolve 就不渲染 loadingComponent，避免快网络下 skeleton 闪一下。这篇讲 delay 与 timeout、Suspense fallback 的分工，给出限速复现步骤，以及升级后与手写防抖叠加成 400ms 的迁移坑。
Vue 前端异步组件

把 Vue 2 老项目搬上 Vue 3：@vue/compat 迁移层、Vite 白屏与 7 步上线顺序

把 Vue 2 老项目搬上 Vue 3：@vue/compat 迁移层、Vite 白屏与 7 步上线顺序
2026-10-25 00:04:22
Vue 2 已于 2023-12-31 EOL，真正拖时间的是插件生态与工具链。本文给出「Vue 2 语法 + Vue 3 引擎」的最小可交付目标，拆解 @vue/compat 迁移构建、Vite 下 alias 导致白屏的修法，以及 filters、$listeners、slot-scope、Vue.set、事件总线等六类移除 API 的分型对照，最后是一套可回滚的 7 步升级顺序。
前端升级 Vue Vue3 迁移前端工程

Vapor 的事件委托改成要手写 .delegate：3.6 RC 里 stopPropagation 的行为变了

Vapor 的事件委托改成要手写 .delegate：3.6 RC 里 stopPropagation 的行为变了
2026-10-24 21:09:47
Vapor 模式以前会把受支持的静态事件自动委托到 document，祖先一调 stopPropagation 子组件的 handler 就不跑了。3.6 RC 改成默认直挂元素、需要委托时显式写 .delegate，同时删掉了 compilerOptions.eventDelegation。本文给迁移步骤和四类需要复核的代码。
Vue 前端事件

Vite 8 升级笔记：Rolldown 接管打包，esbuild 配置怎么迁到 oxc

Vite 8 升级笔记：Rolldown 接管打包，esbuild 配置怎么迁到 oxc
2026-10-23 21:08:33
Vite 8 用 Rolldown 与 Oxc 取代 esbuild、Rollup，配置会被自动转换，但 plugins 只是部分支持、默认 target 提到 Safari 16.4。本文给出完整映射表、先换 rolldown-vite 隔离问题的路径与五步排查。
Vite Vue 前端工程化

Vue Router 4 守卫做鉴权踩到的四个坑：无限重定向、刷新丢动态路由、redirect 开放跳转

Vue Router 4 守卫做鉴权踩到的四个坑：无限重定向、刷新丢动态路由、redirect 开放跳转
2026-10-23 00:04:39
Vue Router 4 用导航守卫做鉴权最容易踩的四个坑：/login 未标 public 造成无限重定向、权限异步加载与 mount 顺序导致刷新被踢回登录页、addRoute 后需 return to.fullPath 重新解析、刷新丢动态路由。附守卫代码、router.isReady 启动顺序与开放重定向校验。
前端路由 Vue Router 导航守卫鉴权动态路由 RDS

history 模式上线后深链接刷新 404：Nginx 回退、/api 被吞与 base 配错的排查

history 模式上线后深链接刷新 404：Nginx 回退、/api 被吞与 base 配错的排查
2026-10-23 00:04:15
history 模式上线后深链接和刷新 404，分五处排查：Nginx try_files 的 $uri/ 目录索引陷阱、/api 被回退成 HTML 导致 Unexpected token '<'、Vite base 与 createWebHistory 只改一边、S3/OSS 错误文档配置、index.html 缓存引用旧 hash 资源。附症状对照表与上线前 curl 自检。
前端路由 Vue Router Nginx history模式 SPA部署

Pinia 4.1.0：六个不报错、只是不生效的地方

Pinia 4.1.0：六个不报错、只是不生效的地方
2026-10-22 21:04:31
Pinia 4.1.0 里六个不报错却不生效的点：对象语法 $patch 不触发 shallowRef、dispose 被替换的 store 才告警、HMR 占位对象状态、@pinia/testing 的 SSR 改为替换语义、ESM only 与 storeToRefs 的 nullish 跳过。附代码前后对比与迁移清单。
Vue Pinia 状态管理 SSR

补丁版本也会改行为：Vue 3.5.44 中四处影响运行时的修复

补丁版本也会改行为：Vue 3.5.44 中四处影响运行时的修复
2026-10-20 21:07:22
Vue 3.5.44 是补丁版本，但 25+ 修复里有四条改运行时行为：watcher 在别的 effect 内不再收集依赖（关闭 #5009）、once watcher 抛错也停止、SSR 开始传播 async setup 的错误、v-html 正确输出 0 和 false。附最小复现代码与升级检查清单。
Vue 前端响应式 SSR

Inertia v3 上线踩的 8 个坑：409 版本冲突、303 重定向与被 CDN 吃掉的 Vary 头

Inertia v3 上线踩的 8 个坑：409 版本冲突、303 重定向与被 CDN 吃掉的 Vary 头
2026-10-19 00:09:59
从 Inertia v3 的 HTTP 协议切入，拆开 X-Inertia 头、page object、409 版本冲突、302→303 转换、Vary 缓存分桶、partial reload 惰性求值与 SSR 13714 探活。每个坑给现象、原因和 curl 验证方式，面向已用 Laravel + Vue 上线、正在排查整页刷新和缓存串味的工程师。
Inertia.js Laravel Vue PHP SPA 前端路由鉴权

Vue Flow：Vue 3 流程图组件的安装、数据结构与样式导入坑

Vue Flow：Vue 3 流程图组件的安装、数据结构与样式导入坑
2026-10-15 21:31:37
Vue Flow 是面向 Vue 3 的流程图/节点编辑器组件，基于 React Flow 与 D3.js 实现缩放平移。本文给出安装、nodes/edges 数据结构、Quickstart 代码，并说明样式必须单独导入且不能用 scoped 这个高频坑，以及 Background/MiniMap/Controls 附加组件与本地开发命令。
Vue Vue3 流程图组件库 TypeScript

Inertia.js 3.9：后台标签页轮询可暂停，退出登录后 Back 键不再翻出缓存里的受保护页面

Inertia.js 3.9：后台标签页轮询可暂停，退出登录后 Back 键不再翻出缓存里的受保护页面
2026-10-15 21:03:21
Inertia.js v3.9 给 usePoll/router.poll 加了 background 选项，可让隐藏标签页的轮询暂停或继续，替代已弃用的 keepAlive；同时 clearHistory 会一并清空 prefetch 缓存，修掉退出登录后按 Back 翻出缓存受保护页面的问题，并说明这是本地展示边界而非鉴权绕过。
Inertia.js Vue 前端 Laravel

Vue Router v5.4.0：预构建 matcher、滚动恢复 API 落地，实验特性下 query 一律归一为数组

Vue Router v5.4.0：预构建 matcher、滚动恢复 API 落地，实验特性下 query 一律归一为数组
2026-10-14 21:31:49
Vue Router v5.4.0（2026-10-07）发布：createRouter 支持传入预构建 matcher，新增 useScrollRestoration 与 onRouteRendered 两个官方 API，并带来一批 hash 参数实验特性（definePage 提取 hash、必填/默认 hash 参数、不再解码 hash）。实验模式下 query 值被统一归一化为数组，属破坏性变更。附完整特性/修复清单与升级建议。
Vue Router 路由 TypeScript 前端

Nuxt v4.6.0：服务端无关化、类型化 $fetch 重建，@nuxt/cli 安装体积下降 73%

Nuxt v4.6.0：服务端无关化、类型化 $fetch 重建，@nuxt/cli 安装体积下降 73%
2026-10-14 21:31:28
Nuxt v4.6.0 带来服务端无关化：新的 nuxt/server 导入面基于 Web 标准的 RequestEvent 类型，不再绑定 h3/nitropack 版本；新增 runtimeConfig.appSecret 与 useSession；基于 fetchdts 重建的类型化 $fetch 把 3000 路由的 TS2589 报错与 946MB 内存压到 140MB。@nuxt/cli v4 安装体积降 73%、nuxt dev 首次绘制快 6.6 倍。含各项基准数据与升级注意点。
Nuxt Vue SSR TypeScript Node.js 前端工程化

Vue 3.6 加一个 vapor 关键字：10k 方块更新从 ~16ms 降到 ~0.2ms

Vue 3.6 加一个 vapor 关键字：10k 方块更新从 ~16ms 降到 ~0.2ms
2026-10-14 20:01:13
Vue 3.6 的 Vapor Mode 用编译期细粒度响应式替代 Virtual DOM，加一个 vapor 关键字即可启用。本文整理 opt-in 语法、createVaporApp/vaporInteropPlugin、不支持的 API、事件委托与 slots.default() 陷阱、自定义指令新接口，以及 benchmark 实测数字与 3.6 beta 安装方式。
Vue Vapor Mode 前端性能 Virtual DOM JavaScript

大家都在搜索什么？

devops 易支付一个官网+多少钱统一接受回调统一回调 python sub node 宝塔日志 mysql shell ElasticSearch css vue api接口对接 2025 支付接口对接 go php php回调