uniapp vue 页面传参问题encodeURIComponent

页面传参objet json序列化后可能会报错

Uncaught SyntaxError: missing ) after argument list

但不一定是数据有问题,而是json成字符串后,字符串中有特殊字符,所以导致parse的时候格式不对。所以解决方案如下

如果传递参数为对象的时候,需要转换成字符串,然后接收的时候,再转换成对象。

如果只是一个字符串的话,就不需要转换了

向子页面传递参数:

javascript 复制代码
uni.navigateTo({
    url: '/pages/index/index?myData=' + encodeURIComponent(JSON.stringify(row))
})

子页面接收数据:

javascript 复制代码
onLoad(option) {
    const myData = JSON.parse(decodeURIComponent(option.myData))
    console.log(myData)
}

encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。

该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。

其他字符(比如 :;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号),都是由一个或多个十六进制的转义序列替换的。

所以

1、项目中如果我们传的参数出现#,/,&这些字符,这些特殊字符会导致我们接收参数的错误
2、必须要用 encodeURIComponent 编码,目标页面进行 decodeURIComponent 解码
相关推荐
代码老中医4 分钟前
接手老项目的一个月,我重构了那个2000行的“祖传”React组件
前端
肖老师xy23 分钟前
uniPush2.0对接
uni-app
用户830407130570130 分钟前
外链跳转后首页参数丢失:从缓存兜底到页面重加载的完整方案
vue.js
用户830407130570134 分钟前
路由传参刷新丢失问题:三种解决方案与最佳实践
前端
从文处安36 分钟前
「前端何去何从」高效提示词(prompts):前端开发者的AI协作指南
前端·aigc
大时光38 分钟前
gsap--《pink老师vivo官网实现》
前端
www_stdio41 分钟前
全栈项目第五天:构建现代企业级 React 应用:从工程化到移动端实战的全链路指南
前端·react.js·typescript
my_styles44 分钟前
window系统安装/配置Nginx
服务器·前端·spring boot·nginx
神奇的程序员1 小时前
不止高刷:明基 RD280UG 在编码场景下的表现如何
前端