Почему мой запрос на выборку вызывает бесконечный цикл ошибок в ReactJ с использованием уведомлений React Toast - PullRequest
Новая
       16

Почему мой запрос на выборку вызывает бесконечный цикл ошибок в ReactJ с использованием уведомлений React Toast

0 голосов
/ 22 декабря 2019

Я хочу получать всплывающее уведомление каждый раз, когда обнаруживаю ошибку в функции извлечения. Я использую цикл внутри компонента перед возвратом, чтобы получить данные о разных городах с помощью accweather api.

Это моя функция обработки ошибок: 

export const handleErrors = (response) => {
if (!response.ok) {
    return Promise.reject(response.statusText);
}
return response;}

Это мой компонент, который извлекает данные: 

import { useToasts } from 'react-toast-notifications';
import handleErrors from '../../handleErrors.js';

const mapStateToProps = state => ({
favorites:state.favorites.favorites})

export const Favorites = (props) => {

const { addToast } = useToasts();
let data = null;

props.favorites.map((city,i) => {
fetch(`http://dataservice.accuweather.com/currentconditions/v1/${city.CityKey}?apikey=${apiKey}`)
 .then(handleErrors)
 .then(response => response.json())
 .then(res => {data = [...data,res[0]];console.log(data)})
 .catch(error => addToast(error.message, { appearance: 'error' }))
});

return(
  <div>
    {data === null ? null : data.map((city,i => {
      return(<FavoriteTile
              city={city}
              key={i}/>
            )
  </div>
)
}

Теперь при попытке загрузить страницу компонента я получаюбесконечные ошибки в тосте и страница вылетает.

1 Ответ

1 голос
/ 22 декабря 2019

Где вы запускаете свой «код извлечения»? Я полагаю, что это должно быть где-то внутри useEffect (componentDidMount), иначе он запускается все время, когда компонент перерисовывается.

...