小程序在父组件执行子组件方法,可适用于下拉刷新上拉加载之后执行子组件方法
程序员文章站
2022-07-05 17:27:15
当父组件引用了子组件的时候,会遇到父组件执行子组件的方法,比如下拉刷新上拉加载等事件只有在页面中才能检测到,但是获取数据的方法在子组件,这时就可以执行子组件方法。 思路很简单,类似于vue中给子组件加ref执行子组件方法道理一样,这里是给子组件加一个 属性: id="子组件名称",比如: 然后在父组 ......
当父组件引用了子组件的时候,会遇到父组件执行子组件的方法,比如下拉刷新上拉加载等事件只有在页面中才能检测到,但是获取数据的方法在子组件,这时就可以执行子组件方法。
思路很简单,类似于vue中给子组件加ref执行子组件方法道理一样,这里是给子组件加一个 属性: id="子组件名称",比如:
<news-list id="list"></news-list>
然后在父组件对应的方法中直接
this.selectComponent("#list").getList();
如果涉及到多次调用该子组件的方法,可以在onReady生命周期中定义一下,比如:
onReady:function(){ this.list = this.selectComponent("#list"); },
之后在方法中再调用的时候直接用this.list.方法名就可以了。比如:
onPullDownRefresh() { let that=this; this.list.getList(); setTimeout(function(){ wx.stopPullDownRefresh() },1000) },