微信小程序中如何实现子向父传参（页面通信）（小程序父子组件传参）

微信小程序中如何实现子向父传参（页面通信）（小程序父子组件传参）

本篇文章带大家了解一下微信小程序中子页面如何向父页面传递参数，希望对大家有所帮助！

程序员必备接口测试调试工具：立即使用Apipost = Postman + Swagger + Mock + Jmeter Api设计、调试、文档、自动化测试工具 后端、前端、测试，同时在线协作，内容实时同步

微信小程序子页面如何向父页面传递参数

【相关学习推荐：小程序开发教程】

问题

wx.navigateBack 无法携带参数，子页面无法向父页面传递参数。

子页面操作父页面数据

这个地方留意一下，我们是说的子页面操作父页面的数据。

在官方文档上有一个getCurrentPages的API(官网描述如下):

PageObject[] getCurrentPages()获取当前页面栈。数组中第一个元素为首页，最后一个元素为当前页面。

不要尝试修改页面栈，会导致路由以及页面状态错误。不要在 App.onLaunch 的时候调用 getCurrentPages()，此时 page 还没有生成。

通过getCurrentPages这个API，我们可以获取到页面栈的数据，所以就可以获取到指定的页面，在子页面通过修改父页面数据的方式，我们就可以实现子页面向父页面传参的功能。

const pages = getCurrentPages();const gotoPage = pages[pages.length - 1];-

所以pages[pages.length - 1]就为当前页面，父页面就为pages[pages.length - 2]，依次类推，我们可以获取到其他的祖先页面。

然后再使用 setData 方法 gotoPage.setData({xxx: ''})来修改设置父页面的数据，从而达到子页面向父页面传递参数的目的。之后再通过 wx.navigateBack 进行页面返回即可。

其他解决方式

组件弹框

如我们文章开头提到，如果是需要从子页面向父页面传递参数，那我们可以通过弹框的形式显示内容，选择完相应的数据之后，隐藏当前的弹框或者组件。

更多编程相关知识，请访问：编程入门！！

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。