微信小程序——頁面中調用組件方法

我現在有一個彈層的組件（popup），組件里面定義了顯示組件(showPopup)和隱藏組件(hidePopup)的方法。

我們如何在調用組件的頁面中調用組件里面的方法呢?

在調用組件的頁面寫如下代碼：

onReady: function() {
    this.popup = this.selectComponent("#popup"); //組件的id
  },
  showPopup(){
    this.popup.showPopup(); //組件里里面定義的showPopup方法
  },
  hidePopup() {
    this.popup.hidePopup(); //組件里里面定義的hidePopup方法

},

 

對上面的代碼做個簡易說明：

先看下效果圖：

 

 對應代碼截圖：

1.調用頁面(Page/.../index.wxml)

 

2.組件頁面（compoents/popup/index.js）：

 

 推薦2篇寫的不錯的博文，可以看看：

【微信小程序】自定義組件

小程序自定義組件的具體實現+頁面與自定義組件間的通信