Блок Catch не срабатывает

avatar
user14695970
9 августа 2021 в 04:16
66
1
0

У меня есть асинхронный вызов API, при котором второй блок .catch не выполняется.

Во-первых, я определил основную функцию вызова API в файле utils следующим образом:

   const getCustomer= (body) => {
    return new Promise(resolve => {
      fetch('/getCustomer', {
        method: 'post',
        body: JSON.stringify(body),
        headers: {
            Accept: "application/json"
            Content-type: "application/json"
-       },
      })
      .then(response => response.json())
      .then(json => resolve(json))
      .catch(err => console.log('error happened', err))
    })
  };

Позже в моем файле JSX я вызываю API, импортируя указанную выше функцию.

getCustomer(myPayload).then(res => {
 setCustomer(res)
}).catch(err => {
 setShowError(true)
})

Что я пытаюсь сделать, так это показать сообщение об ошибке с помощью setShowError, но по какой-то причине я вижу только console.log('error happened', err), выбрасываемое из папки utils, где я определяю свою функцию выборки. Любая идея о том, как я могу исправить это поведение и выполнить функцию catch

Источник
Dave Newton
9 августа 2021 в 04:18
0

Это недействительный JS; не будет компилироваться как есть. Пожалуйста, включите ваш фактический код.

user14695970
9 августа 2021 в 04:23
0

кто-то уже дал мне ответ

Dave Newton
9 августа 2021 в 04:24
0

Да, я знаю. Это не означает, что код не должен быть настоящим кодом.

user14695970
9 августа 2021 в 04:25
0

Друг мой, что, если я не хочу делиться своим настоящим кодом?? Я просто изменил имена, вот и все.

Dave Newton
9 августа 2021 в 04:27
0

... Приведенный код должен быть синтаксически правильным. Это позволяет избежать попадания людей в ненужную кроличью нору. Для этого есть причина — чем ближе код к работоспособному, тем меньше людей должны думать о нем. Это помогает людям помогать вам и является хорошей привычкой.

Dave Newton
9 августа 2021 в 04:33
0

См. страницу Как задать вопрос. Задавая вопрос о проблеме, вызванной вашим кодом, вы получите гораздо лучшие ответы, если предоставите код, который люди могут использовать для воспроизведения проблемы.

Rahul Kumar
9 августа 2021 в 04:42
0

вам нужно выдать ошибку из блока catch метода выборки.

Ответы (1)

avatar
CertainPerformance
9 августа 2021 в 04:19
0

Если вы хотите, чтобы оба .catches выполнялись, вам нужно выполнить бросок внутри первого, иначе результатом будет то, что getCustomer всегда будет возвращать обещание, которое разрешается. Вам также потребуется использовать параметр reject в конструкторе Promise.

new Promise((resolve, reject) => {
    // ...
    .catch(err => {
        console.log('error happened', err);
        reject(err);
    })

и обязательно верните вызов Promise в свой код React:

return setCustomer(res);

Хотя это возможно, обычно лучший подход, если это возможно, состоит в том, чтобы не перехватывать приведенную ниже ошибку, а вместо этого позволить вызывающей стороне обрабатывать ее. Также не используйте явный антишаблон построения Promise.

   const getCustomer= (body) => {
    return fetch('/getCustomer', {
        method: 'post',
        body: JSON.stringify(body),
        headers: {
            Accept: "application/json"
            Content-type: "application/json"
-       },
      })
      .then(response => response.json());
  };

это то, что я предпочитаю. Если вам действительно не нужен сам setCustomer, чтобы справиться с этим, просто позвольте ошибке дойти до вызывающей стороны.