页面跳转传参应优先使用URLSearchParams处理查询参数，其次用sessionStorage传结构化数据，SPA中必须使用框架路由API而非location.href。
页面跳转时传参，核心是让目标页能可靠读取来源页的数据。直接改 window.location.href 最常用，但方式选错或细节没处理好，容易导致参数丢失、中文乱码、安全风险或 SPA 路由冲突。
URL 查询参数：最直接、兼容性最好
把数据拼在 URL 的 ?key=value 后面，适合传递少量、非敏感、可公开的值（如 ID、分页页码、搜索关键词）。
- 用
URLSearchParams构造参数，自动处理编码，避免手动拼接出错：
const params = new URLSearchParams({ id: '123', tab: 'detail' });
window.location.href = `/product.html?${params}`; - 目标页读取也用
URLSearchParams，不依赖正则或字符串切割：
const urlParams = new URLSearchParams(window.location.search);
const id = urlParams.get('id'); // 安全获取，返回 null 而非 undefined - 中文、特殊符号会自动编码，无需额外调用
encodeURIComponent—— 但若手拼 URL，必须加编码，否则可能中断跳转。
localStorage / sessionStorage：适合中等量、需结构化数据
当要传对象、数组，或参数太长不适合塞进 URL 时，可先存再跳转。sessionStorage 更推荐，因为数据只在当前会话有效，关掉标签即清空，更安全。
Java Maven Common
下载
Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。
- 跳转前存：
sessionStorage.setItem('userInfo', JSON.stringify({ name: '张三', role: 'admin' }));
window.location.href = '/dashboard.html'; - 目标页取（建议加 try-catch 防止解析失败）：
try {
const data = JSON.parse(sessionStorage.getItem('userInfo') || '{}');
if (data.name) renderUser(data);
} catch (e) { /* 忽略无效数据 */ } - 注意：不能跨域共享；SPA 中若路由复用同一组件，需主动清理或监听变化，否则旧数据残留。
避免用表单 POST 或 cookie 传参
表单提交看似隐蔽，但实际仍需后端配合接收，纯前端跳转无法真正走 POST；cookie 则有大小限制（通常 4KB）、自动随请求发送（增加开销）、存在安全和过期管理问题。
立即学习“Java免费学习笔记（深入）”；
- 除非已有服务端接口承接，否则不要为前端跳转专门写一个 POST 表单。
- cookie 不适合做跳转参数载体，更适合存登录态、偏好设置等长期标识。
SPA 场景下必须绕开 location.href
React Router、Vue Router 等框架接管了路由，直接赋值 location.href 会触发整页刷新，破坏单页体验，还可能导致状态丢失或白屏。
- 应统一使用框架提供的导航方法：
React Router v6：用useNavigate()函数；
Vue Router：用router.push({ path: '/user', query: { id: 123 } })。 - 若必须兼容旧逻辑，可在跳转前判断是否在 SPA 环境：
if (typeof window.history.pushState === 'function' && window.__ROUTER_ACTIVE__) {
// 走框架路由
} else {
// 走 location.href
}
