昨天介紹了取得 View Model、建立 Instance 與綁定的基本 API，今天接著看 number、boolean、trigger，分別用來更新分數、切換高亮狀態，以及觸發慶祝動畫。

沿用玩家卡片，假設已經跟設計師約定好以下欄位，並在 Editor 設定對應的文字、狀態與觸發行為：

以下使用 High-level API，vmi 沿用昨天已完成綁定的 Instance。

number：讀寫數值

分數、進度、位置都可以使用 number，整數與小數都支援。先取得欄位，再透過 .value 讀寫：

const score = vmi.number("score");
if (!score) throw new Error("請確認 score 欄位");

console.log(score.value); // 讀取目前分數
score.value = 200;       // 設定為 200 分

這裡的 score 代表實際分數，所以直接傳入 200。若欄位代表進度，就要先確認是用 0–1 還是 0–100。前端傳 0.5，設計師卻預期收到 50，語法沒有寫錯，畫面還是會對不起來。

boolean：設定目前狀態

「是否高亮」「是否顯示」這類狀態，可以用 boolean 表達，一樣透過 .value 讀寫：

const isActive = vmi.boolean("isActive");
if (!isActive) throw new Error("請確認 isActive 欄位");

console.log(isActive.value);
isActive.value = true;

這個範例約定 true 表示高亮，之後要恢復一般狀態，就設成 false。高亮的顏色與切換效果，則由 Editor 的設定決定。

trigger：發出與接收訊號

如果需求是「觸發慶祝動畫」，就可以使用 trigger。先取得欄位，再在需要慶祝時呼叫 .trigger()：

const celebrate = vmi.trigger("celebrate");
if (!celebrate) throw new Error("請確認 celebrate 欄位");

celebrate.trigger();

vmi.trigger("celebrate") 是取得欄位，celebrate.trigger() 才是發出訊號。官方語法

也可以在 Editor 設定點擊卡片時觸發 celebrate，讓前端透過 .on() 接收通知。沿用前面的欄位，先註冊監聽，接收後續的觸發：

const onCelebrate = () => {
  console.log("收到慶祝訊號");
};

celebrate.on(onCelebrate);

不再需要監聽時，例如離開頁面，就用同一個 callback 取消：

celebrate.off(onCelebrate);

number、boolean 也支援 .on() 與 .off()，可以用來監聽資料變化。官方監聽說明

訊號代表什麼，要先跟設計師約定。若要通知動畫播放完成，就得在 Editor 把觸發時機設定在動畫結束時。

boolean 與 trigger 怎麼選？

可以從需求的說法判斷：「卡片目前要維持高亮」是在描述狀態，適合 boolean；「這次得分要慶祝」是在通知一件事發生，適合 trigger。官方型別說明

另外，設值後要等下一次 State Machine 或 Artboard 更新，結果才會反映到畫面；使用 High-level API 時，由 runtime 處理這段更新流程。更新時機說明

這三種型別的語法都很短，串接前把數值範圍、狀態意義與觸發行為約定清楚，就能減少來回確認。
明天接著介紹 string、color、enum、image。