uniapp 跳转页面及传递参数 传参
目录1.标签跳转1.标签跳转<navigator :url=" './nav?index='+navData">点击传递参数</navigator>2.api跳转
文章共760字 · 阅读需要大约3分钟
一键AI生成摘要,助你高效阅读
问答
·
目录
类型转换
如开题所说,因为URL传递的只能是字符串,传递JSON、ARRAY不是字符串时候需要先转成字符串,然后接收后再换回来。
var mynavData = JSON.stringify(that.navData); // 这里转换成 字符串
uni.navigateTo({
url:'./nav?index='+mynavData
})
//新页面接收后:
onLoad(options) {
var data = JSON.parse(options.index); // 字符串转对象
console.log(data)
}
1.标签跳转
<navigator :url=" './nav?index='+navData">点击传递参数</navigator>
2.api跳转
//在起始页面跳转到test.vue页面并传递参数
uni.navigateTo({
url: 'test?id=1&name=uniapp'
});
//在test.vue页面接受参数
export default {
onLoad: function (option) { //option为object类型,会序列化上个页面传递的参数
console.log(option.id); //打印出上个页面传递的参数。
console.log(option.name); //打印出上个页面传递的参数。
}
}
3.使用混入的方法传参
<jfSuccess ref="jfS" @submit="openUrl('/pages/competition/perfectInformation/perfectInformation?competitionId=' + competitionId);"></jfSuccess>
4.使用uni.$emit和uni.$on页面通讯
uni.$emit(eventName,OBJECT)
触发全局的自定义事件,附加参数都会传给监听器回调函数。
uni.$on(eventName,callback)
监听全局的自定义事件,事件由 uni.$emit 触发,回调函数会接收事件触发函数的传入参数。
uni.$off([eventName, callback])
移除全局自定义事件监听器。
//在子页面定义事件传参
uni.$emit('update',{msg:'页面更新'})
//在父页面接受参数
export default {
onLoad: function () {
uni.$on('update',function(data){
console.log('监听到事件来自 update ,携带参数 msg 为:' + data.msg);
})
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)