Vue Event Bus提供了一種簡單的方式實現組件間通信。這個事件總線是Vue對象的一個屬性,可以用來廣播事件和監聽事件。在同一應用程序中,不同的組件可以通過事件總線相互通信,而不需要父子組件之間進行通信。
在組件中監聽事件很簡單,只需要使用$on方法即可。$on方法接收兩個參數,第一個參數為事件名,第二個參數為事件回調函數。
mounted() {
this.$bus.$on('event-name', this.callbackFunction);
},
methods: {
callbackFunction() {
// Do something
}
}
在上述代碼中,我們在組件的mounted鉤子函數中使用$on方法監聽一個名為“event-name”的事件,并指定事件回調函數為callbackFunction。當事件發生時,回調函數將被調用。
在另一個組件中廣播一個事件同樣很簡單,只需要使用$emit方法即可。$emit方法接收一個參數,即要廣播的事件名。
methods: {
functionName() {
this.$bus.$emit('event-name');
}
}
在上述代碼中,我們在組件的函數中使用$emit方法廣播了一個名為“event-name”的事件。
總的來說,Vue Event Bus使得組件間通信變得更加簡單,特別是在跨多層層級的組件時非常有用。
上一篇Python 泛函變分
下一篇python 算時間間隔