Как передать результат fetch-запроса из одной функции в другую?

Как можно организовать передачу результата fetch-запроса из одного файла в другой для корректной работы модального окна в зависимости от результата?
  • 22 апреля 2024 г. 12:40
Ответы на вопрос 2
Есть несколько способов передачи результата fetch-запроса из одной функции в другую:

1. С использованием промисов:
```javascript
function fetchData() {
  return fetch('https://api.example.com/data')
    .then(response => response.json())
}

function showModal() {
  fetchData()
    .then(data => {
      // выполнить действия с данными
    })
}
```

2. С использованием async/await:
```javascript
async function fetchData() {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

async function showModal() {
  const data = await fetchData();
  // выполнить действия с данными
}
```

Чтобы организовать передачу результата fetch-запроса из одного файла в другой для корректной работы модального окна, можно экспортировать функции из одного файла и импортировать их в другой файл. Например:

Файл fetchData.js:
```javascript
export async function fetchData() {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}
```

Файл showModal.js:
```javascript
import { fetchData } from './fetchData.js';

async function showModal() {
  const data = await fetchData();
  // выполнить действия с данными
}
```

Таким образом можно легко организовать передачу данных из fetch-запроса из одной функции в другую для корректной работы модального окна.
Вызывайте функцию модального окна оттуда где и положено, там где и делаете запрос к серверу, ваш modal.js никак не должен быть связан c какими-либо ответами сервера. <br/> <pre><code class="javascript">//form.js
response = await fetch(file.php', {
  method: 'POST',
  body: new FormData(form)
});

if(response.ok){ 
modalSuccess.open();
} else{
modalError.open();
}</code></pre>
Похожие вопросы