Question

在我的应用程序中，我有一个工作人员Saga，它从第三方库调用方法。第三方库是一种支付服务（Zuora），该方法初始化iframe表单并在组件中呈现它。第三方库方法需要一个回调函数，该函数在提交iframe表单时调用。

以下是传奇的简化视图：

function* render(action) {
  try {
    const callback = function(response) {
      if (response.success) {
        // DISPATCH ACTION HERE
      }
    }

    ZUORALIBRARY.render(callback);
    yield put({...action, type: RENDER_SUCCESS});

  } catch (e) {
    yield put({...action, type: RENDER_FAIL, errors: e});
  }
}

我想在回调中发出一个动作，但没有运气让它发挥作用。这涉及尝试将回调函数转换为生成器并使用yield / put。我也读过这种方法可能是反模式。

有没有不同/更好的方法来处理这个问题？

Answer 1

做这样的事情

import { call, put } from "redux-saga/effects";

function renderIframe() {
  return new Promise((resolve, reject) => {
    ZUORALIBRARY.render(response => {
      if (response.success) {
        resolve(response);
      } else {
        reject();
      }
    });
  });
}

function* render(action) {
  try {
    const result = yield call(renderIframe);
    yield put({ ...action, type: RENDER_SUCCESS });
  } catch (e) {
    yield put({ ...action, type: RENDER_FAIL, errors: e });
  }
}

使用第三方回调调度操作

1 个答案: