Обработка 401 ответов в реактивном нативном функциональном компоненте

Question

Я получаю следующее предупреждение, когда запрос API возвращает 401, и я отправляю пользователя на экран входа в систему:

Warning: Can't perform a React state update on an unmounted component.

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

.
.
export default function MovieDetailsScreen() {
  const [movie, setMovie] = useState({});
  const movieId = useNavigationParam('movieId');

  useEffect(() => {
    // This is the method that does the request and returns 401 (It
    // uses the fetch library) 
    Client.movies.show(movieId) 
      .then(result => {
        setMovie(result)
      })
  }, [])
.
.
.

Answer 1

Как правило, предупреждения не приводят к сбою приложения.Но вы должны заботиться о них.Например, предыдущее предупреждение (я) может привести к проблемам с производительностью, если неправильно отключить компоненты с состоянием

, запрос (например, Promise) еще не решен, но вы отключите компонент.Затем запрос разрешается, вызывается setMovie() для установки нового состояния, но он попадает на не подключенный компонент.

Вы можете попробовать catch

    Client.movies.show(movieId) 
      .then(result => {
        setMovie(result)
      })
    .catch((err) => {
        Client.movies.stop()
    })