<template>
<view class="">
<button @tap="sendData">页面跳转传参按钮</button>
</view>
</template>
<script>
export default {
data() {
return {
// 传递的对象
devObj:{
Field1:'msg1',
Field2:'msg2%'
}
}
},
methods: {
sendData(){
uni.navigateTo({
url: `/pages/accetDataPage/accetDataPage?devObj=${encodeURIComponent(JSON.stringify(this.devObj))}`
})
}
}
}
</script>
<style>
</style>
爱tutu爱生活
- 发布：2024-03-04 09:50
- 更新：2024-03-04 10:12
- 阅读：286
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10
HBuilderX类型： 正式
HBuilderX版本号： 3.99
手机系统： Android
手机系统版本号： Android 13
手机厂商： vivo
手机机型： V1938T
页面类型： vue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
<template>
<view class="">
<button @tap="sendData">页面跳转传参按钮</button>
</view>
</template>
<script>
export default {
data() {
return {
// 传递的对象
devObj:{
Field1:'msg1',
Field2:'msg2%'
}
}
},
methods: {
sendData(){
uni.navigateTo({
url: `/pages/accetDataPage/accetDataPage?devObj=${encodeURIComponent(JSON.stringify(this.devObj))}`
})
}
}
}
</script>
<style>
</style>
<template>
<view class="">
<button @tap="sendData">页面跳转传参按钮</button>
</view>
</template>
<script>
export default {
data() {
return {
// 传递的对象
devObj:{
Field1:'msg1',
Field2:'msg2%'
}
}
},
methods: {
sendData(){
uni.navigateTo({
url: `/pages/accetDataPage/accetDataPage?devObj=${encodeURIComponent(JSON.stringify(this.devObj))}`
})
}
}
}
</script>
<style>
</style>预期结果：
不会报错
不会报错
实际结果：
解析%存在问题
解析%存在问题
bug描述：
navigateTo跳转页面使用encodeURIComponent(JSON.stringify(this.devObj))传递对象报错，此对象的信息只要含有%，新页面就会报"URIError: URI malformed"的错误
爱豆豆 - 办法总比困难多
特殊符号需要转码
<template>
<view class="">
<button @tap="sendData">页面跳转传参按钮</button>
</view>
</template>
<script>
export default {
data() {
return {
// 传递的对象
devObj: {
Field1: 'msg1',
Field2: 'msg2%'
}
}
},
methods: {
// 对查询关键字中的特殊字符进行编码
encodeSearchKey(key) {
const encodeArr = [{
code: '%',
encode: '%25'
}, {
code: '?',
encode: '%3F'
}, {
code: '#',
encode: '%23'
}, {
code: '&',
encode: '%26'
}, {
code: '=',
encode: '%3D'
}];
return key.replace(/[%?#&=]/g, ($, index, str) => {
for (const k of encodeArr) {
if (k.code === $) {
return k.encode;
}
}
});
},
sendData() {
uni.navigateTo({
url: `/pages/accetDataPage/accetDataPage?devObj=${encodeURIComponent(this.encodeSearchKey(JSON.stringify(this.devObj)))}`
})
}
}
}
</script>
参考文档:https://blog.csdn.net/u010486124/article/details/81102224
