小程序在父组件执行子组件方法，可适用于下拉刷新上拉加载之后执行子组件方法

蓓蕾心晴

发布于 2018-08-15 07:28:56

1.1K00

代码可运行

文章被收录于专栏：前端小叙前端小叙

运行总次数：0

代码可运行

当父组件引用了子组件的时候，会遇到父组件执行子组件的方法，比如下拉刷新上拉加载等事件只有在页面中才能检测到，但是获取数据的方法在子组件，这时就可以执行子组件方法。

思路很简单，类似于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)
  },

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2018-08-08 ，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

登录后参与评论

0 条评论

热度