1、 繫結事件並新增條件

2、 同一個事件註冊多個回撥

3、 tag 標籤

4、 設定事件優先順序

5、 註冊單次事件

事件

不會自己執行，需要觸發（即事件被觸發之後才可執行）。審視任何JavaScript程式碼的核心，你會發現正是事件是把所有東西融合在一起。下面我學習了一些在數字孿生視覺化場景中事件的常用方法。

1、 繫結事件並新增條件

事件添加了條件，只有在符合該條件的數字孿生視覺化物體上 click 才會觸發，無論是已經存在的 Thing 物件，還是後面新建立的 Thing 物件都會生效。

app。on（“click”， “。Thing”， function（ev） { console。log（“you click ” + ev。object。id）；}）；obj。on（“click”， “。Marker”， function（ev） { console。log（ev。object。name）；}）；

上面的例子，當這個數字孿生視覺化物體子孫裡有 Marker 物體，當它被點選就會觸發。同全域性繫結 Marker 物體，繫結後 obj 的子孫裡新建立的 Marker 也響應這個事件。

2、 同一個事件註冊多個回撥

試想一下，如果有一個模組在數字孿生視覺化物體 click 時，改變物體顏色，另外一個模組需要在物體 click 時，放大物體。兩個模組又是不同人寫的，那該如何註冊事件呢？

// 事件1：obj。on（“click”， function（ev） { ev。object。style。color = “#FF0000”；}）；// 事件2：obj。on（“click”， function（ev） { ev。object。scale = ［2， 2， 2］；}）；// 解除安裝 obj 全部的 click 事件obj。off（“click”）；

這兩個事件，都會在 obj 被點選後觸發。但使用 off（） 解除安裝事件時，兩個事件都會同時被解除安裝。因此我更推薦使用［tag］的方式。

3、 tag 標籤

如果取消或者暫停事件，都要知道原回撥函式，在大部分時候會比較麻煩，可以給數字孿生視覺化場景中每個事件打上 tag，在刪除或者暫停時，可用 tag 直接指定你要操作的回撥。

//模組1中：obj。on（“click”，function（ev） { ev。object。style。color = “#FF0000”；}，“模組1”）； //模組2中：obj。on（“click”，function（ev） { ev。object。scale = ［2， 2， 2］；}，“模組2”）；//取消“模組1”的事件回撥，不影響“模組2”的回撥obj。off（“click”，null ，“模組1”）；

4、 設定事件優先順序

兩個都是 click 事件，如果希望保證模組 2 的事件先於模組 1 觸發，則需要新增一個引數 priority，一般事件預設的優先順序是 50，設定的越大，越優先觸發。

//模組1：obj。on（“click”，function（ev） { ev。object。style。color = “#FF0000”；}，“模組1”）； //模組2：obj。on（“click”，function（ev） { ev。object。scale = ［2， 2， 2］；}，“模組2”，51）；

5、 註冊單次事件

在數字孿生視覺化場景中如果需要一個事件只執行一次，就需要解除安裝掉，你可以使用 one 這個介面代替 on，引數和 on 是一樣的。

提供 priority 的能力：

// 下例中是給每個樓層的註冊了一次 EnterLevel 事件，即 每個樓層第一次進入時 都會響應app。one（THING。EventType。EnterLevel， ‘。Floor’， function （ev） { console。log（ev。object。id）；}） // 如果只給某個樓層註冊 如下var floor = app。query（‘。Floor’）［0］；floor。one（THING。EventType。EnterLevel， function （ev） { console。log（ev。object。id）；}）

—————————————————

數字孿生視覺化：https：//www。thingjs。com/