<template>
<div>
<button @click="navigateTo('/pages/components/swiper/index?name=usmile%e7%94%b5')">
swiper1
</button>
<button @click="navigateTo('/pages/components/swiper/index?name=usmile电')">
swiper2
</button>
{{ option }}
</div>
</template>
<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app';
import { ref } from 'vue';
const option = ref("")
onLoad((op) => {
console.log('onLoad', op)
option.value = JSON.stringify(op || {})
})
function navigateTo(url: string) {
uni.navigateTo({
url: url,
})
}
</script>
<style scoped></style>
z***@foxmail.com
- 发布：2026-02-27 15:09
- 更新：2026-02-27 15:21
- 阅读：27
产品分类： uniapp/H5
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 26.3
浏览器平台： Chrome
浏览器版本： 145.0.7632.111（正式版本） (arm64)
项目创建方式： CLI
CLI版本号： 3.0.0-alpha-4070620250731001
示例代码：
操作步骤：
见BUG描述和附件demo工程
uni.navigateTo({url: '/pages/components/swiper/index?name=usmile%e7%94%b5'})
见BUG描述和附件demo工程
uni.navigateTo({url: '/pages/components/swiper/index?name=usmile%e7%94%b5'})
预期结果：
跳转后
location.herf = http://localhost:5173/#/pages/components/swiper/index?name=usmile%e7%94%b5
跳转后
location.herf = http://localhost:5173/#/pages/components/swiper/index?name=usmile%e7%94%b5实际结果：
跳转后
location.herf = http://localhost:5173/#/pages/components/swiper/index?name=usmile%25e7%2594%25b5
跳转后
location.herf = http://localhost:5173/#/pages/components/swiper/index?name=usmile%25e7%2594%25b5bug描述：
本地调试，http://localhost:5173/
通过uni.navigateTo({url: '/pages/components/swiper/index?name=usmile%e7%94%b5'}) 打开页面后。
通过location.href获取到的页面地址为 http://localhost:5173/#/pages/components/swiper/index?name=usmile%25e7%2594%25b5
看得出来location.href拿到的name = encodeURIComponent('usmile%e7%94%b5')
附件是demo
欢迎到专业群（ uni-app 官方技术交流群 1 ） 咨询，群中有相关专业的管理员和群友。
作为官方评审人员，我来对这个 bug 反馈进行评审：
一、反馈完整性评估
✅ 内容完整性较好
- BUG标题：明确指出了"H5 navigateTo打开页面后，当前 location.href 编码异常"
- BUG描述：详细说明了问题现象，包括具体的URL变化对比
- 代码示例：提供了可直接运行的最小复现demo
- 复现步骤：与代码示例结合，描述清晰
- 预期/实际结果：对比明确，用具体URL展示差异
- 环境信息：包含了平台(Mac)、工具版本(HBuilderX正式版)等关键信息
⚠️ 需要补充的信息
- HBuilderX具体版本号：只写了"正式版"，建议补充如"4.87"这样的具体版本
- uni-app版本：未明确是vue2还是vue3项目
- 测试浏览器：未说明测试用的浏览器及版本
二、问题合理性分析
✅ 预期结果合理
用户期望的location.href保持usmile%e7%94%b5是合理的，因为：
%e7%94%b5已经是URL编码后的"电"字- 不应该被二次编码为
%25e7%2594%25b5
✅ 实际结果确认异常
实际出现的二次编码现象确实不符合标准URL处理规范，属于异常行为。
三、技术依据分析
根据知识库中的router文档：
- 明确提到"参数中出现空格等特殊字符时需要对参数进行编码"
- 但文档中使用的是
encodeURIComponent单次编码，没有提及二次编码问题
四、结论与建议
? 确认为有效bug
这是一个有效的bug反馈，问题表现为：
- uni-app H5端路由处理时对已URL编码的参数进行了二次编码
- 影响了通过location.href获取URL的准确性
? 处理建议
- 优先级：建议标记为中优先级，影响H5端URL参数解析
- 临时方案：用户可在目标页面使用
decodeURIComponent二次解码作为临时解决方案 - 修复方向：需要检查uni-app H5端路由跳转时对URL参数的处理逻辑，避免对已编码参数重复编码
? 补充验证建议
建议用户在目标页面添加验证代码：
onLoad((options) => {
console.log('原始参数:', options.name)
console.log('解码后:', decodeURIComponent(options.name))
console.log('二次解码:', decodeURIComponent(decodeURIComponent(options.name)))
})这个反馈整体质量较高，信息完整，复现路径清晰，可以进入bug修复流程。
内容为 AI 生成，仅供参考
