커스텀 프러시저 데이터 모델 만들기

프로시저는 프로시저의 서명 (이름, 매개변수, 반환)을 정의하는 모든 참조 지원 데이터 모델을 차단합니다. @blockly/block-shareable-procedures 플러그인에서 제공하는 데이터 모델은 Blockly의 기존 내장 프로시저 블록의 동작을 복제하도록 빌드됩니다.

여기에는 맞춤 절차 블록에 원치 않는 동작이 포함됩니다.

  • 반환 유형은 지원되지 않습니다.
  • 모든 매개변수는 전역 변수와 연결됩니다.

다른 동작을 원하는 경우 자체 맞춤 절차 데이터 모델을 만들면 됩니다.

절차 모델 구현

절차 데이터 모델은 IProcedureModel 인터페이스를 구현해야 합니다.

class MyProcedureModel {
  constructor(workspace, name, id) {
    this.workspace = workspace;
    this.name = name;
    this.id = id;

    // Note: construction should not add the model to the procedure map.
  },

  // Other methods are omitted for brevity...
}

매개변수 모델 구현

파라미터 데이터 모델은 IParameterModel 인터페이스를 구현해야 합니다.

class MyParameterModel {
  constructor(workspace, name, id) {
    this.workspace = workspace;
    this.name = name;
    this.id = id;
  },

  setProcedureModel(model) {
    this.model =  model;
    return this;
  }

  // Other methods are omitted for brevity...
}

트리거 변경사항

프로시저 모델의 변경을 트리거하는 메서드는 @blockly/block-shareable-procedures 플러그인에서 triggerProceduresUpdate도 호출해야 합니다. 이렇게 하면 절차 블록에서 doProcedureUpdate이 호출되어 다시 렌더링됩니다.

import {triggerProceduresUpdate} from '@blockly/block-shareable-procedures';

class MyProcedureModel {
  setName(name) {
    this.name = name;
    triggerProcedureUpdate();
    return this;
  }

  // Other methods are omitted for brevity...
}

class MyParameterModel {
  setName(name) {
    this.name = name;
    triggerProcedureUpdate();
    return this;
  }

  // Other methods are omitted for brevity...
}

이벤트

@blockly/block-shareable-procedures 플러그인의 절차 모델은 절차가 수정될 때도 이벤트를 발생시킵니다. 이를 통해 여러 작업공간을 동기화하고 절차 모델을 작업공간 간에 공유할 수 있습니다. 원하는 경우 이벤트를 발생시킬 수도 있습니다.

역직렬화

클래스에는 역직렬화를 지원하는 static loadState 메서드도 각각 필요합니다.

class MyProcedureModel {
  static loadState(state, workspace) {
    // Note that the procedure model should not deserialize parameters.
    // The deserializer will handle that.
    return new MyProcedureModel(workspace, state.name, state.id);
  }

  // Other methods are omitted for brevity...
}

class MyParameterModel {
  static loadState(state, workspace) {
    return new MyParameterModel(workspace, state.name, state.id);
  }

  // Other methods are omitted for brevity...
}