state 바인딩
값에 따라 형상 자체를 갈아 끼웁니다 — 열린 밸브 그림과 닫힌 밸브 그림.
필요: 요소 안에
data-scada-state="이름" 조각이 여럿 · 심볼 밸브(개폐형상) · 상태 배지에 들어 있습니다prop: state 규칙 출력 = 상태 이름 · 그 이름의 조각만 보이고 나머지는 숨는다설명
색을 바꾸는 것으로는 부족하고 모양이 달라져야 할 때 씁니다. 열린 밸브와 닫힌 밸브는 색만 다른 것이 아니라 그림이 다릅니다.
한 요소 안에 상태별 조각을 미리 다 그려 넣고 이름표를 붙여 둡니다. 값이 들어오면 임계값 규칙 이 그 값을 상태 이름으로 바꾸고, 그 이름의 조각만 보이고 나머지는 숨습니다.
지금 상태 조각을 가진 심볼은 두 개입니다 — 밸브(개폐형상) 와 상태 배지. 둘 다 open · closed 두 상태를 가지고 있습니다.
visible 여러 개로도 같은 일을 할 수 있지만, 상태가 셋만 넘어가도 바인딩이 여러 줄로 늘어나고 "둘 다 보임"이나 "아무것도 안 보임" 같은 어긋난 상태가 생깁니다. 이쪽은 항상 하나만 보이는 것이 보장됩니다.
설정 항목
| 이름 | 값 | 기본 | 설명 |
|---|---|---|---|
| 태그 | tagId | — | 읽을 게이트웨이 태그. |
| 규칙 | threshold[] | (없음) | 출력이 상태 이름입니다(예: open · closed). |
| 기본값 | string | (없음) | 어느 규칙에도 안 맞을 때의 상태 이름. |
동작
값 1 · 규칙 == 1 → open → open 조각만 보임. 나머지 상태 조각은 전부 숨습니다.
규칙이 없으면 태그 값을 그대로 상태 이름으로 씁니다. 게이트웨이가 이미 open / closed 같은 글자를 내려 준다면 규칙 없이 바로 연결됩니다.
어느 상태 이름과도 안 맞으면 조각이 하나도 안 보입니다. 요소가 통째로 빈 자리가 되므로 "심볼이 사라졌다"로 보입니다. 오타(opened vs open)이거나, 규칙이 값을 못 받아 기본값도 없이 빠져나온 경우입니다 — 기본값을 반드시 정해 두세요.
상태 이름은 심볼 안에 적힌 것과 글자 그대로 같아야 합니다. 대소문자도 구분합니다.
해 보기
제품 샘플 › 가압 펌프 스테이션밸브가 개폐에 따라 그림 자체를 바꾼다
제품에 들어 있는 샘플
제품 샘플 › 관제실 3면 (멀티 모니터)운전 현황판에서 상태 배지로 쓰인 예
제품에 들어 있는 샘플
제품 샘플 › 바인딩 표현 사전18가지 prop 을 한 화면에 나란히 놓고 비교
제품에 들어 있는 샘플