@reduxjs/toolkit#Dispatch TypeScript Examples

export function listSchedulerEntriesAsync() {
  return async (dispatch: Dispatch<SchedulerEntriesActionTypes>) => {
    dispatch({ type: LIST_SCHEDULER_ENTRIES_BEGIN });
    try {
      const response = await listSchedulerEntries();
      dispatch({
        type: LIST_SCHEDULER_ENTRIES_SUCCESS,
        payload: response,
      });
    } catch (error) {
      console.error(
        `listSchedulerEnqueueEventsAsync: ${toErrorStringWithHttpStatus(error)}`
      );
      dispatch({
        type: LIST_SCHEDULER_ENTRIES_ERROR,
        error: toErrorString(error),
      });
    }
  };
}

export function listSchedulerEnqueueEventsAsync(entryId: string) {
  return async (dispatch: Dispatch<SchedulerEntriesActionTypes>) => {
    dispatch({ type: LIST_SCHEDULER_ENQUEUE_EVENTS_BEGIN, entryId });
    try {
      const response = await listSchedulerEnqueueEvents(entryId);
      dispatch({
        type: LIST_SCHEDULER_ENQUEUE_EVENTS_SUCCESS,
        payload: response,
        entryId,
      });
    } catch (error) {
      console.error(
        "listSchedulerEnqueueEventsAsync: ",
        toErrorStringWithHttpStatus(error)
      );
      dispatch({
        type: LIST_SCHEDULER_ENQUEUE_EVENTS_ERROR,
        error: toErrorString(error),
        entryId,
      });
    }
  };
}

saveLocally = () => (dispatch: Dispatch, getState: () => storeType) =>
  Promise.resolve().then(() => {
    if (!getState().component.componentDataList.length) {
      return;
    }
    sessionStorage.setItem('componentDataList', getState().component.componentDataList);
    sessionStorage.setItem('canvasInformation', getState().config.canvasInformation);
    sessionStorage.setItem('config', getState().config);
  })

upComponentAction = () => (dispatch: Dispatch, getState: () => storeType) => {
  const { curComponentIndex, componentDataList } = getState().component;
  // 上移图层 当前index，表示元素在数组中越往后
  if (curComponentIndex < componentDataList.length - 1) {
    dispatch(
      upDownHandle({
        curComponentIndex,
        displacementIndex: curComponentIndex + 1,
      }),
    );
  }
}

downComponentAction = () => (dispatch: Dispatch, getState: () => storeType) => {
  // 下移图层 index，表示元素在数组中越往前
  const { curComponentIndex } = getState().component;
  if (curComponentIndex > 0) {
    dispatch(
      upDownHandle({
        curComponentIndex: curComponentIndex,
        displacementIndex: curComponentIndex - 1,
      }),
    );
  }
}

paste =
  (isContextMenuMouse: boolean) => (dispatch: Dispatch, getState: () => storeType) => {
    if (!getState().copys.copyData!) {
      return;
    }
    dispatch(
      pasteAction({
        isContextMenuMouse,
        top: getState().contextMenu.top,
        left: getState().contextMenu.left,
      }),
    );
    dispatch(addComponent(getState().copys.copyData!));
    if (getState().copys.isCut) {
      // 要清空
      dispatch(changeCopyDataAction(null));
      dispatch(changeCutStatusAction(false));
    }
  }

cut = () => (dispatch: Dispatch<any>, getState: () => storeType) => {
  if (!getState().component.curComponent) {
    return;
  }
  dispatch(copy());
  dispatch(deleteComponentAction([getState().component.curComponent?.componentId!]));
  dispatch(changeCutStatusAction(true));
  // 防止多次剪切操作，导致触发剪贴功能
  dispatch(curComponentAction(null));
}

undo = () => (dispatch: Dispatch, getState: () => storeType) => {
  if (getState().snapshot.snapshotIndex >= 0) {
    dispatch(undoAction());
    const componentData: templateDataType[] =
      getState().snapshot.snapshotData[getState().snapshot.snapshotIndex] || [];
    if (getState().component.curComponent) {
      // 如果当前组件不在 componentData 中，则置空
      let needClean = !componentData.find(
        (item) => getState().component.curComponent?.componentId === item.componentId,
      );
      if (needClean) {
        dispatch(curComponentAction(null));
      }
    }
    dispatch(setComponentDataListAction(componentData));
  }
}

redo = () => (dispatch: Dispatch, getState: () => storeType) => {
  if (getState().snapshot.snapshotIndex < getState().snapshot.snapshotData.length - 1) {
    dispatch(redoAction());
    dispatch(
      setComponentDataListAction(
        getState().snapshot.snapshotData[getState().snapshot.snapshotIndex],
      ),
    );
  }
}

export async function poll_settings(dispatch: Dispatch) {
    dispatch(
        load_settings({
            settings: {
                display: (await window.electron.load_settings_sync(
                    'display'
                )) as unknown as any,
                bitcoin: (await window.electron.load_settings_sync(
                    'bitcoin'
                )) as unknown as any,
            },
        })
    );
}

constructor(appStore: AppStore) {
        this.dispatch = appStore.dispatch.bind(appStore) as Dispatch<any>;
        this.subscribe = appStore.subscribe.bind(appStore);
        this.getState = appStore.getState.bind(appStore);
    }

private dispatch: Dispatch<any>;

fetchAchievements = (account: string) => async (dispatch: Dispatch) => {
  try {
    const achievements = await getAchievements(account)
    dispatch(setAchievements(achievements))
  } catch (error) {
    console.error(error)
  }
}

setShapeStyleAction =
  (val: MergeCSSProperties) => (dispatch: Dispatch, getState: () => storeType) => {
    dispatch(setShapeStyle(val));
    dispatch(getCanvasConfigInformationAction(getState().config));
  }

copy = () => (dispatch: Dispatch, getState: () => storeType) => {
  const { component } = getState();
  if (component.curComponent) {
    dispatch(copyAction(component.curComponent));
  }
}

recordSnapshot = () => (dispatch: Dispatch, getState: () => storeType) => {
  const { component } = getState();
  dispatch(recordSnapshotAction(component.componentDataList));
}