我正在學(xué)習(xí)如何使用 Gia(對(duì)于小型 Web 項(xiàng)目),我無(wú)法了解如何通過(guò) Gia 的事件總線將事件對(duì)象從一個(gè)組件傳遞到另一個(gè)組件的事件處理程序。下面是兩個(gè)基本組件,通過(guò)事件總線進(jìn)行通信:class navigation extends Component { constructor(element) { super(element); // // Define "Sub-components" this.ref = { navLinks: [], }; } mount() { // // Listen for clicks on nav.-links for (let i = 0; i < this.ref.navLinks.length; i++) { const link = this.ref.navLinks[i]; link.addEventListener("click", this.handleNavLinkClick.bind(this)); } } handleNavLinkClick(e) { // // Emit event let clickedLink = e.target; if (clickedLink.classList.contains("callHeader")) { eventbus.emit("callingSubpageHeader"); } }}class subpageHeader extends Component { mount() { // // Listen for call from eventbus eventbus.on( "callingSubpageHeader", this.handleEventBusCall_callHeader.bind(this) ); } // // Eventbus handler(s) handleEventBusCall_callHeader() { console.log("The subpage-header was called."); }}事件的發(fā)出和第二個(gè)組件中處理程序的后續(xù)調(diào)用工作正常。但是,我想在調(diào)用處理程序時(shí)將其他信息從第一個(gè)組件傳遞到第二個(gè)組件。Gia 文檔提到事件總線的 emit 方法可以將事件對(duì)象傳遞給處理程序:調(diào)用以前使用相同事件名稱注冊(cè)的任何處理程序??蛇x事件對(duì)象可用作參數(shù),該參數(shù)作為參數(shù)傳遞到處理程序中。eventbus.emit('eventName'[, eventObject]);不幸的是,沒(méi)有示例,我不知道傳遞對(duì)象是如何工作的。我嘗試將“某物”(在本例中為第一個(gè)組件中單擊的鏈接)添加到 emit 函數(shù)的調(diào)用中,但不知道如何/在哪里可以讀取/使用它,也不知道將某些內(nèi)容作為事件傳遞對(duì)象是否以這種方式工作:class navigation extends Component { constructor(element) { super(element); // // Define "Sub-components" this.ref = { navLinks: [], }; } mount() { // // Listen for clicks on nav.-links for (let i = 0; i < this.ref.navLinks.length; i++) { const link = this.ref.navLinks[i]; link.addEventListener("click", this.handleNavLinkClick.bind(this)); } } handleNavLinkClick(e) { // // Emit event if (clickedLink.classList.contains("callHeader")) { eventbus.emit("callingSubpageHeader", [e.target]); } }}如果有人能解釋在這種情況下傳遞事件對(duì)象的概念和語(yǔ)法,那就太好了。
Gia:如何通過(guò)事件總線將事件對(duì)象傳遞給處理程序
藍(lán)山帝景
2022-09-23 09:23:37