Реагировать на обновление несмонтированного компонента - PullRequest
Новая
       6

Реагировать на обновление несмонтированного компонента

0 голосов
/ 05 июня 2018

поэтому у меня есть эта функция, которая извлекает плейлист из моего API и после этого обновляет состояние.

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

Warning: Can only update a mounted or mounting component. This usually means you called setState, replaceState, or forceUpdate on an unmounted component. This is a no-op.

Я хотел бы знать, каковы наилучшие методы, чтобы избежать такого рода конфликтов.

Заранее спасибо заваши ответы! 

  async getUserPlaylists() {
    let data = await request({ path: '/playlists' });
    data = data || [];

    const sanitizedPlaylists = data.map((item, index) => ({
      key: index,
      name: item.name,
      imageUrl: item.imageUrl,
      ...item,
    }));

    this.setState({
      playlists: sanitizedPlaylists,
      loadingPlaylists: false,
      submitting: false,
    });

    return request.data;
  }

1 Ответ

0 голосов
/ 05 июня 2018

Вы можете попытаться прервать запрос в componentWillUnmount, что должно привести к тому, что Обещание не будет выполнено: 

this.request = request({ path: '/playlists' });
let data = await this.request;

componentWillUnmount() {
  if (this.request) this.request.abort();
}

В качестве альтернативы просто установите флаг: 

componentWillUnmount() {
  this.unmounted = true;
}

И проверьте егоперед звонком setState: 

if (this.unmounted) return;
this.setState(...)

Хотя все это может быть ненужным осложнением.Вы можете просто игнорировать предупреждение при разработке.

...