wepy中元件之間通訊方法

2022-05-06 03:42:13 字數 1261 閱讀 7900

events是wepy元件事件處理函式物件,存放響應元件之間通過broadcast、emit、$invoke所傳遞的事件的函式。

$broadcast事件由父元件發起,所有的子元件都會收到父元件發出的資料,嗯,類似於村口的廣播大喇叭。他的傳播順序為:

在父元件的某個函式內,向子元件下發了index-broadcast這個通知,如下:

//

template

//script

onshow()

那麼在子元件中,可以用這種方法來接受資料:

//

template}//

script

props =

events = receive $ from $`)

}}

emit 與 broadcast 正好相反,事件發起元件的所有祖先元件會依次接收到emit事件,如果元件 come 發起乙個 emit 事件,那麼接收到事件的先後順序為:元件coma、頁面page_index。如下圖:

}我們可以看到counter元件的plus方法向父元件$emit了乙個乙個名叫index-emit的方法,父元件該如何接收他?

直接在父元件的events裡面寫就好啦:

events =

}

$invoke是乙個頁面或元件對另乙個元件中的方法的直接呼叫,通過傳入元件路徑找到相應的元件,然後再呼叫其方法。

比如,想在頁面page_index中呼叫元件coma的某個方法:

this.$invoke('coma', 'somemethod', 'someargs');
在父元件中,想要呼叫子元件counter的某個方法,如下:

this.$invoke('emptystatus', 'showempty', 111, 222)

this.$invoke('emptystatus', 'hideempty', 333, 444)

那麼在子元件中可以通過這樣來接收父元件傳過來的引數:

methods =,

hideempty(a, b)

}

wepy元件子父傳值 wepy 元件通訊與互動

wepy.component基類提供三個方法 broadcast,emit,invoke,因此任一頁面或任一元件都可以呼叫上述三種方法實現通訊與互動,如 this.emit some event 1,2,3,4 元件的事件監聽需要寫在events屬性下,如 import wepy form wepy...

元件之間通訊

一 父元件向子元件傳遞資料 在 vue 中,可以使用 props 向子元件傳遞資料。子元件部分 這是 header.vue 的 html 部分,logo 是在 data 中定義的變數。如果需要從父元件獲取 logo 的值,就需要使用props logo 在 props 中新增了元素之後,就不需要在 ...

vuejs中父子元件之間通訊

parent.vue class parent msg message v child div template import vchild from child.vue export default data script child.vue class child p div template ...