时间戳

首页 > 解决方案 > 单击按钮时如何在传奇函数上运行调度？

reactjs - 单击按钮时如何在传奇函数上运行调度？

问题描述

我有一个用例，我可能会在游戏后期调度动作（传奇）。我有一个应用程序，用户填写表格，稍后当用户单击提交时，将调用 saga 操作，通过该操作我将从 api 获得响应。但我还有另一个在应用程序初始化时运行的工人传奇。不知何故只初始化工作其他叉子不起作用 -

传奇/applicationSaga.js

export function* initialize() {
  yield call(getAppInfo);
}

export function* getAppInfo() {
  try {
    const appInfo = (yield call(
      AppApi.getAppInfo
    )).data;
  } catch (e) {
    throw new Error(e);
  }
}

export function* submitDecision({payload}) {
  try {
    const submitDecision = yield call(AppApi.submitDecision, payload)
  } catch (e) {
    throw new Error(e);
  }
}

export function* applicationSaga() {
  yield fork(takeEvery, ActionTypes.INITIALIZATION_REQUESTED, initialize);
  yield fork(takeEvery, ActionTypes.SUBMIT_DECISION, submitDecision)
}

传奇/index.js

import { applicationSaga, initialize } from "./applicationSaga";

export default function* rootSaga() {
  yield all([applicationSaga(), initialize()]);
}

标签： reactjsreact-reduxredux-saga

解决方案

这是在 Saga 中调用生成器函数的方法。为了使应用程序与数据同步，必须正确实现 Store、Actions 和 reducer。请查看如何在 `onClick` 事件中调用 Redux Saga 操作？这个。

你的JS.js

import store from "YOUR_LOCATION/store";

submit = () => {
  store.dispatch({type: "SUBMIT", payload: YOUR_PAYLOAD});
}

<button onClick={this.submit}>Submit</button>

SAGA.js

import { takeLatest } from "redux-saga/effects";

export const watchSubmit = function* () {
    yield takeLatest("SUBMIT", workerSubmit);
};


function* workerSubmit(action) {
    try {
    // Your code
    } catch {
        message.error("Failed")
    }
}

推荐阅读