Javascript CustomEvent Detail 在觸發時為空？

Question

好吧，自幾天前的最后一個問題以來，我已經取得了一些進展，但我對 Javascript 和 Three.js 仍然很陌生，並且遇到了這個新問題。

我正在嘗試將從 OBJ 文件加載的一些 Three.js 幾何圖形作為與自定義事件關聯的詳細信息傳遞，以便我可以進一步處理它。 由於 OBJLoader 異步運行，因此這樣做是有意義的：

 function loadObjAsMesh( obj ) { // Obj Resource URL: Example: 'assets/monster.obj' var geometry; var mesh; loader = new THREE.OBJLoader(); console.log('About to call loader.load'); loader.load( obj , function ( object ) { console.log('Starting to run loader.load CALLBACK'); geometry = new THREE.Geometry().fromBufferGeometry( object.children["0"].geometry ); mesh = new THREE.Mesh ( geometry, sceneEntities.materials.bluePhongSolid ); console.log( mesh ); scene.add( mesh ); console.log ( 'About to dispatch the Finished Loading Event' ); dispatchEvent( sceneSyntheticEvents.objectFinishedLoading, { detail : { passedMesh : mesh } } ); console.log ( 'Just Dispatched the Finished Loading Event' ); console.log ( sceneSyntheticEvents.objectFinishedLoading ); console.log('Done running loader.load CALLBACK'); } ); console.log('Done calling loader.load'); }

然后，這是事件eventlistener ：

 function events() { sceneSyntheticEvents.objectFinishedLoading = new CustomEvent('objectFinishedLoading'); console.log ( 'About to catch the Finshed Loading Event' ); addEventListener('objectFinishedLoading', function (e) { console.log ( e.detail.passedMesh ); }, false); console.log ( 'Just Caught the Finished Loading Event' ); }

事件成功觸發並被偵聽器“聽到”。 問題是 event.detail 為空。 我試過用幾種不同的方式來格式化細節——沒有骰子，所以我很確定這不是語法或約定的問題。

如您所見，我在應用程序中有大量儀器，這清楚地表明，一旦事件觸發，問題就會發生。 並不是聽眾沒有得到e.detail 。 不知何故，細節在它觸發的那一刻根本沒有包含在事件中。

我什至嘗試用幾種不同的方式測試整數，認為問題出在網格上。 我試過這個例如：

 dispatchEvent( sceneSyntheticEvents.objectFinishedLoading, { detail : { passedMesh : "32" } }

還有……

 dispatchEvent( sceneSyntheticEvents.objectFinishedLoading, { detail : "32" }

即使這樣，控制台報告：

 CustomEvent {isTrusted: false, detail: null, type: "objectFinishedLoading", target: Window, currentTarget: Window…}

詳細信息：空？ 引號中的“詳細信息”，而不是引號中，沒有差異。

我顯然對此一無所知。 有什么想法嗎？

Answer 1

dispatchEvent方法接受一個參數，即事件對象。

您需要將detail對象傳遞給事件構造函數。 在您的情況下，您將事件選項作為第二個參數傳遞給dispatchEvent ，這不會產生任何影響。

 addEventListener('my-custom-event', function(e) { console.log('event handler', e.type); console.log(e.detail) }, false); var event = new CustomEvent('my-custom-event', { detail: { key: 'detail-value' } }) dispatchEvent(event);