用于 redux-saga 中错误处理的打字稿

Question

在 worker saga 的 catch 块中处理的 action.ts 中 error 的类型是什么？

action.ts

const actionError = (error): IFluxStandardAction => {
  return {
    type: ACTIONTYPE_ERROR,
    payload: error
  };
};

saga.ts

function* WorkerSaga(value) {
  try {
    const { payload } = value;
    const response: Response = yield call(clientApi, payload);
    yield put(Actions.Success(response));
  } catch (error) {
    yield put(Actions.Error(error));
  }
}

Parameter 'error' implicitly has an 'any' type, but a better type may be inferred from usage.ts(7044)

Answer 1

如@AlekseyL 所述。在评论中，它通常但不总是一个 Error 对象。 catch 子句要求您捕获 any 或 unknown。 您可以使用 if (error instanceof Error) 检查它是否是 Error .

Error 是不可序列化的。理想情况下，您会在 saga 或 action creator 中从中提取一些属性，而不是在 action 中传递不可序列化的对象。很容易提取一个 string.

catch (error: any) {
  yield put(Actions.Error(String(error) || "An unknown error occurred"));
}

一个Error对象的string转换是这样的：

String(new Error("some message"))
 --> "Error: some message"

这是一个类型安全的助手，用于将 any 错误转换为具有 name 和 message 的对象。

interface ErrorData {
  name: string;
  message: string;
}

const toError = (error: any): ErrorData => {
  if (error instanceof Error) {
    return {
      name: error.name,
      message: error.message
    };
  } else {
    return {
      name: "Error",
      message: error?.toString() || "An unknown error occurred"
    }
  }
};

Typescript Playground Link

用于 redux-saga 中错误处理的打字稿

Typescript for Error handling in redux-saga

reactjs

typescript

redux

redux-saga