Every React Dev Needs To Know This About AbortController

Key Takeaways

handling Global event listeners and react is a little bit of a pain because you first of all need to extract out your event listeners so that way you can remove them down here and you need to make sure you remove them every time your function cleans up so the more event listeners you have the more complicated your return statement down here comes this can be drastically cleaned up though by using the abort controller in this new set of code you can see that our return statement all it's doing is aborting our abort controller and what we're doing is we're passing along the signal portion of our aboard controller as an option to our ad event listener this allows us to pass other things on along here such as capture and so on but if all we care about is the signal we can just pass the controller along directly what this does is every time we call a controller abort it will remove these event listeners for us automatically which means no matter how many event listeners we add all we have to do is call controller abort once we could even add these particular functions in line if we want it and it's going to work perfectly fine and removes all the code up here now if you want to learn more about this abort control I have a full video covering how you can use it with event listeners as well as all the other amazing features of it it'll be linked at the bottom of the screen