Javascript 在Typescript中处理承诺捕获

我有一个基于promise的API服务，它从我的后端请求数据。它也有自己的错误捕获，所以我不必到处写。当它这样写的时候：

BackendService.ts

...
getTasks() {
    return axios.get('/api/tasks')
        .then((response) => {
            const {
                tasks
            }: {
                tasks: tasksType
            } = response.data;
            return tasks;
        })
        .catch((error) => console.log(error));
}
...

条目。tsx

...
const getTasks = () => {
    backendService.getTasks()
        .then((tasks: tasksType) => {
            const filteredTasksData = filterAPIDataForState(tasks);

            addTasks({
                tasks: filteredTasksData
            });
        })
}
...

我得到以下错误：

TS2345: Argument of type '(tasks: tasksType) => void'
is not assignable to parameter of type '(value: void | tasksType) => void | PromiseLike<void>'.Types of parameters 'tasks'
and 'value'
are incompatible.Type 'void | tasksType'
is not assignable to type 'tasksType'.Type 'void'
is not assignable to type 'TaskInterface[]'.

TS2345:类型为“（tasks:tasksType）=>void”的参数
不可分配给类型为“（值：void | tasksype）=>void | PromiseLike”的参数。参数类型为“tasks”
和“价值”
不兼容。请键入“void | tasksType”
不可分配给类型“tasksType”。类型“void”
不可分配给类型“TaskInterface[]”。

我猜这是因为捕获，这可能使承诺什么也不返回（因为console.log）。如果我从

Entries.tsx

中给出

gettask

它自己的catch处理程序，并将其从BackendService.ts

gettask

中删除，它就会工作

---

如果出现错误，Typescript难道不能判断

条目.tsx

中的

.then（）

将不会运行，因为已经有一个catch在处理这种情况了吗？

有很多选项可以处理这种情况

在BackendService.getTasks（）中，只需删除条目的.getTasks（）中的.catch（）和handle.catch（）

在BackendService.getTasks（）中，添加另一个then并返回空任务，例如。then（it=>it | | |[]）

Axios不会在响应错误时崩溃，所以您必须正确地检查响应并处理它，因为它不应该只是盲目地破坏响应对象

如果出现错误，Entries.tsx中的.then（）将不会运行，因为 已经有人在处理这种情况了

这并不完全正确

catch

block in

getTasks

方法in

backendService.ts

文件返回

undefined

和当

catch

块返回值时，不是抛出捕获的错误，而是调用调用代码的

catch

块，

然后调用

块

这是因为

backendService.ts

文件中的

getTasks

方法返回的

Promise

取决于以下内容：

• 如果

  axios.get（…）

  返回的

  Promise

  实现了您在

  then（…）

  块中的操作

• 如果

  axios.get（…）

  返回的

  Promise

  被拒绝，那么在

  catch（…）

  块中执行什么操作

在您的情况下，如果

axios.get（…）

返回的

Promise

实现，那么

然后（…）

块将执行，并且由于它只返回

任务

，

backendService.ts

文件中的

getTasks

方法返回的

Promise

实现了对

然后（…）的调用

在调用代码中阻塞，即在

Entries.tsx

文件中

如果

axios.get（…）

返回的

Promise

被拒绝，将执行

catch（…）

块。由于

getTasks

方法中的

catch（…）

block只是记录错误，

getTasks

方法返回的

Promise

将实现

未定义的
值，这将导致调用代码中
然后（…）
block的调用，即在
Entries.tsx
文件中

请参见以下示例以了解这一点


函数getData（）{
//url不正确，将导致响应。确定为false
常量url=https://jsonplaceholder.typicode.com/todo/1';
返回获取（url）
。然后（响应=>{
if（response.ok）{
返回response.json（）；
}否则{
抛出新错误（）；
}
})
.catch（错误=>console.log（'getData函数中的catch块'）；
}
getData（）
.then（data=>console.log（'then block ran'））
.catch（error=>console.log（'error block ran'）

在BackendService.ts中，您返回的任务变量不是承诺。如果要提取数据，请使用await或Axios.then（）中的函数。看见查看并选择最适合您和您的项目的方法。PS：由于您使用的是Typescript，我建议您选择await。@CarloCorradini，从我在中看到的（请参阅链接代码），您可以返回一个变量，然后使用以下

。然后（）

将能够使用它。请尝试使用@Yousaf据我所知，没有承诺得到回报：\@CarloCorradini:承诺就是这样起作用的。在

.then（）

中返回的任何内容都封装在承诺中。类似于在标有

async

关键字的函数中返回的任何内容，它返回一个承诺。因此，

返回任务

返回任务的承诺。请阅读如何承诺和异步/等待work@Vincent不，没有。您必须考虑“代码> GETTASKS（））/>代码>在每个单独的调用中不返回任何错误（并发生错误），并适当地处理（例如向用户显示错误消息）或转发错误的情况。如果这些处理程序中的许多处理程序都执行相同的操作，那么您当然可以通过向每个

.catch（）

传递相同的函数来共享代码。嘿，谢谢您的回答。如果我像第一个解决方案那样处理它，那么每次调用backendService.getTasks（）时都必须实现捕获。有没有办法防止这种情况？你能解释一下第二种解决方案背后的原因吗？选项2只是在出现错误时返回空任务。但正如我所说，Axios不会在响应错误时崩溃，所以您必须正确地检查响应并处理它，因为它不应该只是盲目地破坏响应对象。因此，您首先不需要.catch（）。谢谢您的回复！我实现了第二个解决方案，只需将错误记录到控制台。这是我第一次看到这些多功能