uniapp uni.navigateTo 传值的几种方式

流氓也是种气质 _Cookie

已于 2025-02-24 09:51:15 修改

阅读量1.1w

点赞数 4

CC 4.0 BY-SA版权

分类专栏： uni-app 文章标签： html

于 2021-09-24 10:20:11 首次发布

本文链接：https://blog.youkuaiyun.com/qq_37550440/article/details/120449694

40 篇文章

订阅专栏

本文介绍了uniApp中使用uni.navigateTo方法进行页面跳转时如何传递字符串和对象参数，并详细解释了如何通过encodeURIComponent和decodeURIComponent确保数据完整传输的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

传入

let title = 'hello'
uni.navigateTo({
	url:`buttonPage/buttonPage?title=${title}`
})

接收

onLoad(option) {
			let { title } = option
		},

传入

let data = {
    title:'hello',
    id: 1
}
uni.navigateTo({
	url:`buttonPage/buttonPage?data=`+ encodeURIComponent(JSON.stringify(data))
})

接收

url传参时，不转换数据且当参数带有特殊字符的时候，会被截取数据，从而导致数据不完整。因此，想要解决这个问题，需要使用encodeURIComponent对数据进行解码。

onLoad(option) {
	let data = JSON.parse(decodeURIComponent(option.data))
	console.log(data)
},

使用这两个encodeURIComponent, decodeURIComponent js内置的方法，数据中有%时会报Error in onLoad hook: "URIError: URI malformed的异常bug。

报错原因：路径上所传参数内含有%，浏览器在对“%”执行decodeURIComponent解码时就会报错

解决办法：在传参数编码之前把“%”转换成“%25”，在解码时在更换为%

uni.navigateTo({
url:`buttonPage/buttonPage?data=`+ encodeURIComponent(JSON.stringify(data).replace(/%/g, '%25'))
})

onLoad(option) {
let data = JSON.parse(decodeURIComponent(option.data).replace(/%25/g, '%'))
console.log(data)
}