Slate 이벤트와 액션 연결

Events 패널은 특정 이벤트가 발생했을 때 실행할 액션을 연결합니다. 이벤트는 클릭, 값 변경, 대화상자 열기나 닫기, 질의 실행 완료 같은 발생 신호입니다. 액션은 대화상자나 알림 열기, 질의 실행 또는 변수값 변경처럼 앱이 수행할 동작입니다.

Slate의 이 액션은 온톨로지 데이터 편집을 정의하는 Foundry Action type과 구분합니다. 각 이벤트와 액션은 이벤트와 액션 참조의 이름과 전달값 형식을 따릅니다.

Events 패널의 코드

패널에는 앱에 구성한 이벤트와 액션 쌍이 표시됩니다. 연결만으로 충분한 동작은 JavaScript를 작성하지 않아도 됩니다. 값을 전달하거나 실행 조건을 정해야 할 때에는 Handlebars 참조와 JavaScript를 사용합니다.

이 코드에는 DOM이나 Slate 화면 상태를 직접 조작하는 접근이 없으며 내부 상태를 다음 실행까지 보관하지 않습니다. 반환값이 연결된 액션의 입력이 됩니다. Events editor에서는 Handlebars helper도 사용할 수 없습니다.

버튼으로 수동 질의 실행

수동으로 실행할 q_query와 버튼 w_button을 준비합니다.

Events 패널에서 새 연결을 만들고 Event는 w_button.click, Action은 q_query.run을 선택합니다. Update로 저장합니다. 이 연결에는 JavaScript가 필요하지 않습니다.

사용자가 버튼을 누를 때마다 질의를 다시 실행하고 그 결과를 사용하는 위젯과 함수에 새 데이터를 제공합니다.

변경된 값을 액션에 전달

숫자를 선택하는 w_selectionDropdown과 숫자 변수 v_doubleSelection을 준비합니다. Event는 w_selectionDropdown.selectedValue.changed, Action은 v_doubleSelection.set으로 설정합니다.

var dropdownSelectionValue = {{slEventValue}};
return 2 * dropdownSelectionValue;

slEventValue는 이벤트와 함께 전달되는 값입니다. .changed 이벤트에서는 변경 후의 새 값이 들어옵니다. 위 코드는 그 값의 두 배를 반환하고 .set 액션이 반환값을 변수에 저장합니다.

단순한 파생값 계산은 Slate 함수로 구성하는 것이 일반적입니다. 값을 특정 이벤트에 맞춰 저장할 필요가 있을 때 이벤트와 .set을 사용합니다.

선택 이력 누적

v_selectionHistory를 Array 변수로 만들고 기본값을 []로 설정합니다. 같은 Dropdown의 selectedValue.changed 이벤트를 v_selectionHistory.set 액션에 연결합니다.

var history = {{v_selectionHistory}};
var newValue = {{slEventValue}};
history.push(newValue);
return history;

현재 배열에 새 값을 덧붙여 반환하면 .set이 이력을 갱신합니다. 일반 변수는 앱을 다시 로드하면 기본값으로 돌아갑니다. 재방문 뒤에도 보관할 값은 User storage의 수명과 크기 조건에 맞게 구성합니다.

입력이 있을 때만 질의 실행

텍스트 입력 w_input1, w_input2, 버튼 w_buttonConditional과 수동 질의 q_queryConditional을 준비합니다. 질의는 두 입력의 .text 값을 사용합니다.

Event를 w_buttonConditional.click, Action을 q_queryConditional.run으로 정하고 다음 코드를 입력합니다.

var input1Text = {{w_input1.text}};
var input2Text = {{w_input2.text}};
if (input1Text === "" || input2Text === "") {
  return {{slDisableAction}};
}

slDisableAction을 반환하면 이번 이벤트에 연결된 액션을 실행하지 않습니다. 두 값이 빈 문자열이 아니면 아무 값도 반환하지 않고 q_queryConditional.run이 정상 진행합니다. 이 조건은 빈 문자열을 검사하므로 공백 문자만 있는 값은 통과합니다.

이 반환값은 동작 실행을 제어합니다. 버튼의 표시 상태나 시각적 비활성화는 위젯 설정에서 별도로 구성합니다.