Melhor abordagem Cancelar função Assíncrona no desmonte de um componente (React)

[ViniciusGularte]

Bom dia, qual a melhor maneira de se cancelar a requisição assíncrona quando realizo o componentWillUnmount do meu componente?

No meu caso utilizo axios, para fazer as requests, e tenho que impedir ele de setar o setState quando o componente está desmontado.

Tinha a forma de associar um this.mounted = true; quando montava o componente e this.mounted = false; no desmonte, porém seguindo a docs do react, já esta depreciado este método, eu tenho um spa bem grande, e to buscando um método com reaproveitamento muito grande para resolver isto, alguma dica pessoal?

[fdaciuk]

O método isMounted() não deve ser usado, mas você pode criar uma propriedade na classe para saber se o componente está sendo desmontado, como mostrado aqui:
https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html

De qualquer forma, como você está usando axios, por baixo dos panos ele usa XHR, que tem um método para abortar o request. Essa é a melhor maneira de fazer isso :)
https://github.com/axios/axios#cancellation

[ViniciusGularte]

Obrigado @fdaciuk , sabe de alguma forma integrar o CancelToken com o interceptor do axios?

[fdaciuk]

@ViniciusGularte não uso o axios, então não sei te dizer :)
Eu uso essa lib que eu fiz.. pra abortar é só usar o método abort() do request em questão:
https://github.com/fdaciuk/ajax#abort-request

[Juuhz]

Poderia me descrever oque você está querendo fazer ? De repente tenha outro jeito mais prático, ao invés de querer implementar algo mais complexo.

Mas caso queira seguir nessa linha de raciocínio, você pode implementar o "isMounted()", manualmente:
https://stackoverflow.com/a/51739506

[ViniciusGularte]

@Juuhz eu pensava em cancelar todas requisições em andamento independente qual requisição seja, quando o componente foste desmontando, apenas uma função única tratando todas requests, não sei se isto é possível com axios, por hora to usando a abordagem que o @fdaciuk propos