Vue Router v5.4.0 发布:预构建 matcher、滚动恢复与 hash 参数实验特性
Vue Router 团队发布了 v5.4.0 版本。本次更新包含一项破坏性变更、多项实验性功能以及若干 bug 修复,重点集中在路由匹配器、hash 参数处理与滚动恢复能力上。
译注:本文翻译自 Vue Router 官方 GitHub Release Notes,原文链接见文末。
破坏性变更
在实验性(experimental)模式下,查询参数(query)的值现在会被统一规范化为数组。该变更由 @posva 在 #2824 中提交(commit f1fbc)。使用实验性特性的项目需要检查依赖 query 值类型的代码。
新特性
核心能力
createRouter支持传入预构建的 matcher:由 @danielroe 在 #2804 中实现(commit 9de96),允许开发者复用或自定义路由匹配器。- 新增
useScrollRestoration与onRouteRendered:由 @posva 在 #2805 中实现(commit e3dde),为滚动位置恢复和路由渲染完成时机提供官方 API。 beforeEnter迁移诊断:帮助开发者识别实验性beforeEnter的迁移问题(commit b695c)。
实验性特性
- 对旧式可选参数移除发出警告(#2818,commit c2f92)。
- 通过
definePage提取 hash 参数(commit dbf2d)。 - 支持配置必填与默认 hash 参数(commit cef5c)。
- 不再对 hash 进行解码,仅做保护性编码(#2760,commit aca2c)。
definePage中的路径参数支持自定义正则表达式(#2822,commit 3a192)。- router 默认恢复 hash 与顶部位置(commit 7c385)。
Bug 修复
本次修复覆盖多个方面:
- 在历史导航中,针对目标解析实验性守卫重定向(commit 2c5fb)。
- 实验性:在
MatcherPatternPathStar.build()中保留静态前缀的声明大小写(#2798,commit 4dc6b)。 - 使 hash 参数可选且可为空(commit d9a4c)。
- 从必填 hash 参数中排除默认值(commit 346e2)。
- 使 hash 参数解析与 query 保持一致(commit cf251)。
- 保留最后一个 hash 参数而非抛出异常(commit d1e8a)。
- 禁止 query 参数同时设置必填与默认值(commit f60e9)。
- 在 push 时,带默认值的 query 参数视为可选(commit fb604)。
- 重定向时不再继承 params、query 或 hash(commit 02a92)。
- history:使过期的滚动位置失效(#2814,commit 071f1)。
- unplugin:清理
definePage导入中的命名视图(#2809,commit 0711d)。 - 在参数段正则中保留十六进制字符编码(#2811,commit 07663)。
性能优化
- unplugin:缓存合并后的路由覆盖配置(#2821,commit 732b7)。
小结
v5.4.0 的核心看点在于 createRouter 接受预构建 matcher、useScrollRestoration 与 onRouteRendered 两个新 API,以及围绕 hash 参数的一系列实验性改进。由于存在一项实验性破坏性变更,建议使用实验特性的项目在升级前先阅读相关 commit 说明。