Uniapp 传参返回上一级页面 - 详细教程及代码示例
"Uniapp 传参返回上一级页面 - 详细教程及代码示例"\n\n本文将详细介绍在 Uniapp 中如何使用 uni.navigateTo() 和 uni.navigateBack() 方法进行页面跳转并传参,以及如何在目标页面和上一级页面获取参数。\n\n## 使用 uni.navigateTo() 传参并跳转到目标页面\n\n1. 使用 uni.navigateTo() 方法进行页面跳转,并通过 url 参数传递参数。\n\njavascript\n// 传参并跳转到目标页面\nuni.navigateTo({\n url: '/pages/targetPage?param1=value1¶m2=value2'\n});\n\n\n2. 在目标页面中,可以通过 this.$route.query 来获取传递的参数。\n\njavascript\n// 目标页面\nonLoad: function (options) {\n var param1 = this.$route.query.param1;\n var param2 = this.$route.query.param2;\n}\n\n\n## 使用 uni.navigateBack() 返回上一级页面并传参\n\n1. 使用 uni.navigateBack() 方法返回上一级页面,并通过 delta 参数指定返回的页面层数。\n\njavascript\n// 返回上一级页面并传递参数\nuni.navigateBack({\n delta: 1,\n success: function () {\n // 在上一级页面的 onLoad 事件中获取参数\n onLoad: function (options) {\n var param1 = options.param1;\n var param2 = options.param2;\n }\n }\n});\n\n\n2. 在上一级页面中,可以通过 onLoad 事件的 options 参数来获取传递的参数。\n\n## 跳转到 tabBar 页面传参\n\n需要注意的是,以上方法只适用于跳转到非 tabBar 页面的情况。如果目标页面是 tabBar 页面,可以使用 uni.switchTab() 方法跳转,并通过 url 参数传递参数。\n\njavascript\n// 跳转到 tabBar 页面\nuni.switchTab({\n url: '/pages/tabBarPage?param1=value1¶m2=value2'\n});\n\n\n在目标页面中,可以通过 this.$route.query 来获取传递的参数。\n\n## 总结\n\n本文详细介绍了 Uniapp 中页面跳转传参的两种方法,并附带代码示例,帮助你快速掌握 Uniapp 页面传参技巧。\n
原文地址: https://www.cveoy.top/t/topic/pAQe 著作权归作者所有。请勿转载和采集!