一個組件結束后要更新另一個組件數據,但是另一個組件和這個組件沒有上下級關系
在 Vue 中,非父子組件之間進行通信通常需要使用事件總線或者其他的全局事件管理器。在你的代碼片段中,vueEvent 似乎是一個事件總線對象,通過 emit 方法觸發了名為 'updateData' 的事件,并使用 on 方法監聽了該事件。這種模式在 Vue 應用中是常見的,它允許不同組件之間進行解耦的通信。
vueEvent.all.delete('updateData'),看起來是在組件卸載前刪除了 'updateData' 事件的監聽器。這么做的原因可能是為了確保在組件銷毀時移除不再需要的事件監聽器,以防止內存泄漏和不必要的事件處理。
通常,為了避免內存泄漏和不必要的資源占用,你會在組件銷毀前做一些清理工作,包括取消訂閱事件、清除定時器等。在這個例子中,vueEvent.all.delete('updateData') 語句的目的就是從事件總線中移除對 'updateData' 事件的監聽器。
//一個組件:import { getCurrentInstance, onBeforeUnmount } from 'vue';const vueEvent = getCurrentInstance()?.appContext.config.globalProperties.vueEvent;vueEvent.emit('updateData');//另一個組件:const vueEvent = getCurrentInstance()?.appContext.config.globalProperties.vueEvent;vueEvent.on('updateData', reload);//此處是和onMounted同級onBeforeUnmount(() => {vueEvent.all.delete('updateData');});