小程序中怎么进行父子组件传值和方法调用?(方法汇总)(微信小程序父子组件传值)

网友投稿 812 2022-09-29

小程序中怎么进行父子组件传值和方法调用?(方法汇总)(微信小程序父子组件传值)

小程序中怎么进行父子组件传值和方法调用?(方法汇总)(微信小程序父子组件传值)

小程序中怎么进行父子组件传值和方法调用?下面本篇文章给大家汇总分享一些微信小程序父子组件传值及方法调用的方法,希望对大家有所帮助!

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

自定义组件封装

注册一个 tab 组件

组件使用

在需要使用该组件的页面的 json 页面上导入组件,在 wxml 下像 HTML 标签一样使用就好了。

-

什么是父组件,什么是子组件?父组件就是在页面中需要引入其他的组件的组件,而子组件就是引入的组件。父向子传递数值,是通过属性的方式来传值,而子向父传值还要通过方法的方式来传值。

父组件向子组件传值

父组件通过属性传值

-

子组件通过properties接收:

properties: { childParams: { type: String }}-

子组件调用父组件方法

这个方法也可以理解为子组件向父组件传递参数的方法。

父组件定义方法,childFun是子组件中的方法名,fun是父组件中的方法名。我们通过chidlFun来调用fun。

-

父组件方法:

childFun(e){ console.log('我是父组件的方法', e)}-

clickFun(){ this.triggerEvent('childFun');//如果需要传递参数,直接写在triggerEvent的参数里即可}-

父组件调用子组件的方法

-

父组件的 onReady 生命周期中获取 childEle 元素

onReady(){ this.childEle = this.selectComponent('#childEle');}-

父组件触发子组件的方法:

childF(){ this.childEle.foo()}-

这里的 foo即为子组件的方法。

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

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

上一篇:Spring基础之AOP的概念介绍
下一篇:存储系统(还需要输入1个字)
相关文章

 发表评论

暂时没有评论,来抢沙发吧~