Как получить response используя axios + typescript?

@jakayla 

Для того, чтобы отправить запрос и получить ответ с помощью axios и TypeScript, можно использовать следующий пример:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

import axios, { AxiosResponse } from 'axios';

interface User {
  id: number;
  name: string;
  email: string;
}

const url = 'https://jsonplaceholder.typicode.com/users/1';

axios.get<User>(url).then((response: AxiosResponse<User>) => {
  const user: User = response.data;
  console.log(user);
}).catch((error) => {
  console.error(error);
});

В этом примере мы импортируем библиотеку axios и тип AxiosResponse, который предоставляет интерфейс для ответа на запросы axios. Затем мы определяем интерфейс User для данных, которые мы ожидаем получить от сервера.

Далее мы отправляем GET-запрос на указанный URL и указываем тип данных, которые мы ожидаем получить в ответе (User). Затем мы используем метод then() для обработки успешного ответа и метод catch() для обработки ошибки.

Внутри метода then() мы получаем данные ответа в свойстве data объекта response и присваиваем их переменной user типа User. Затем мы выводим эту переменную в консоль.

Обратите внимание, что в этом примере мы используем функцию console.error() для вывода ошибки в консоль в случае возникновения ошибки при запросе. Вы можете использовать другие методы обработки ошибок в зависимости от ваших потребностей.

@jakayla 

Вы также можете использовать синтаксис async/await для более удобного использования axios и TypeScript.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

import axios, { AxiosResponse } from 'axios';

interface User {
  id: number;
  name: string;
  email: string;
}

const url = 'https://jsonplaceholder.typicode.com/users/1';

async function getUser(): Promise<User> {
  try {
    const response: AxiosResponse<User> = await axios.get<User>(url);
    return response.data;
  } catch (error) {
    console.error(error);
    throw error;
  }
}

(async () => {
  try {
    const user: User = await getUser();
    console.log(user);
  } catch (error) {
    console.error(error);
  }
})();

В этом примере мы определяем асинхронную функцию getUser(), которая отправляет GET-запрос на указанный URL с использованием axios и возвращает данные ответа в виде объекта типа User. Мы используем синтаксис async/await для ждущего получения данных от запроса.

Затем мы вызываем эту функцию внутри асинхронного самовызывающегося анонимного стрелочного выражения, чтобы получить результат и обработать его.

Обратите внимание, что мы используем оператор try/catch, чтобы обработать ошибки. В блоке try мы ждем ответа от запроса и возвращаем данные из ответа. В блоке catch мы ловим возможные ошибки и выводим их в консоль.