Question

我在我的代码中使用Subject，并想知道是否建议以这种方式执行。

首先，对于我使用的主题是，当按下切换按钮时，其他按钮将被设置为非活动状态。

按下edit后：

主题定义和订阅者实现代码：

  let oButtonSubject = new Rx.Subject();
  this._subscribeButtonState(oButtonSubject);

_subscribeButtonState: function (oButtonSubject) {
      let self = this;
      return oButtonSubject
        .subscribe(function (oBtnState) {
          let oModel = self.getModel("vmButtonsState");
          oModel.setProperty("/edit", oBtnState.bEdit);
          oModel.setProperty("/mass", oBtnState.bMass);
          oModel.setProperty("/save", oBtnState.bSave);
          oModel.setProperty("/cancel", oBtnState.bCancel);
        });
    },

上面的代码将设置按钮的状态。

每次按下edit时，都会调用next方法并将数据推送到oButtonSubject。

_subscribeEditPressOb: function (oEditPressed, oButtonSubject) {
      let self = this;
      return oEditPressed
        .map(function (oSource) {
          return oSource;
        })
        .subscribe(function (oSource) {

            // Determine select state for the calendar.
            // The calendar is only allowed to select, if
            // EDIT button is clicked.
            if (oSource.getId().indexOf("cal-edit") >= 0 && oSource.getPressed()) {
              oButtonSubject.next({bEdit: true, bMass: false, bSave: false, bCancel: false});
            } else {
              oButtonSubject.next({bEdit: true, bMass: true, bSave: true, bCancel: true});
            }
          },
          function (err) {
            jQuery.sap.log.fatal(err);
          });
    },

在将数据推送到主题后，上面的代码在按下时会订阅edit按钮。

这是使用主题的正确方法吗？

Answer 1

Subject是指从非反应世界进入Rx世界的入口。在您的情况下，您根据编辑按钮上的点击事件使用Subject 发出事件。

我建议您不要使用主题进行此特定实施，而是使用fromEvent

将您的点击直接用作流

以下是一个示例（忽略粗糙边;它在DOM中保持状态）（jsbin）

const editButton = document.getElementById('enable-edit-mode')
const saveChangesButton = document.getElementById('save-changes');
const cancelChangesButton = document.getElementById('cancel-save-changes');

const enableEditModeStream = Rx.Observable.fromEvent(editButton, 'click')
.do(() => {
  editButton.setAttribute('disabled','disabled')
  saveChangesButton.removeAttribute('disabled');
  cancelChangesButton.removeAttribute('disabled');
});

const saveChangesStream = Rx.Observable.fromEvent(saveChangesButton, 'click')
  .do(() => {
    console.log('saving changes')
  });
const cancelChangesStream = Rx.Observable.fromEvent(cancelChangesButton, 'click');

const saveCancelEditModeStream = Rx.Observable.merge(
  saveChangesStream,
  cancelChangesStream
)
.do(() => {
  editButton.removeAttribute('disabled');
  saveChangesButton.setAttribute('disabled','disabled')
  cancelChangesButton.setAttribute('disabled','disabled')
});


Rx.Observable.merge(
  enableEditModeStream,
  saveCancelEditModeStream
)
.subscribe();

建议使用或不使用主题

1 个答案: