外部ライブラリなしでGoogle Maps APIイベントを聴くにはどうすればよいですか？

Question

自分の知識のためにreact-google-mapsライブラリなしでReactを使ってGoogle Maps JS APIイベントに応答する方法を理解しようとしています。イベントリスナーを追加する伝統的なJavascriptの方法でこれを行うことはできますか？特に

が、私は同じで定義された機能で、Googleマップのマーカーをクリックイベントに応答しようとしているGoogleマップで作成しているコンポーネントを反応させるの。あなたの助けを

感謝を！

Answer 1

この回答では、jsを使用してマップにイベントリスナーを追加し、次にカスタムイベントリスナーを使用してイベントを作成する方法について説明します。

---

まず、jsを使用してマップにイベントリスナーを追加します。解決策は非常に簡単です。あなたは、このコード行を使用することができます。

ここ

//Listen to your map 
map.addListener('idle', function (e) { 
    alert("Load"); 
}); 

、あなたは（例では、マップ）オブジェクトに簡単なリスナーを追加します。このコードは、マップが完全にロードされている（アイドル状態の）ときにウィンドウにアラートを追加します。

Googleのイベントドキュメントhereをご覧ください。

---

次に、カスタムリスナーとカスタムイベントを作成しようとします。

この行は、イベントを初期化する '構築'：

var event = new Event('build'); 

そして、このラインコールこのイベントのすべてのリスナーの構築 '：

// Dispatch the event. 
window.dispatchEvent(event); 

今、私たちはリスナーを作成することができます

を

//Listen to your custom event 
window.addEventListener('build', function() { 
    console.log('OK'); 
}); 

コードは次のようになります。

var event = new Event('build'); 
//Listen to your custom event 
window.addEventListener('build', function() { 
    console.log('OK'); 
}); 
// Dispatch the event. 
window.dispatchEvent(event); 

完全なドキュメントhereがあります。