Thanks for this post! what does "Adding an interceptor in a component is a side effect, so we get help from useEffect hook." mean? i followed this post just same. but in my case there is some problem. so i deleted 'return () => instance.interceptors.response.eject(interceptor);' <- this line.
it's works but little weird.. it runs always twice because of and first is always fail, only second one works. once i delete the then it doesn't work.. so! i deleted useEffect() then it works very well. i tried that using only without useEffect(). then interceptor runs 4 times............i don't know why, but i wanna know...
Thanks for the comment.
Adding an interceptor in a component is a side effect because we are manipulating something that is out of our scope of component.
you should eject previous interceptor in the clean up function and in the case you didn't, each time the useEffect is executed, one interceptor will be added to interceptors stack and this not the expected behaviour.
And be aware of new behaviour of strict mode in React 18 that execute effect twice in development mode. you can read more about that in this link Adding Reusable State to StrictMode
Thanks to your explanation, I totally understand! Your writing saved me, and the comments helped me a lot!
I put eject code back because I thought I needed it and It works well! and also your explanation about strict mode in React 18 helped me! it much better! Thank you! 😊
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Thanks for this post! what does "Adding an interceptor in a component is a side effect, so we get help from useEffect hook." mean? i followed this post just same. but in my case there is some problem. so i deleted 'return () => instance.interceptors.response.eject(interceptor);' <- this line.
it's works but little weird.. it runs always twice because of and first is always fail, only second one works. once i delete the then it doesn't work.. so! i deleted useEffect() then it works very well. i tried that using only without useEffect(). then interceptor runs 4 times............i don't know why, but i wanna know...
Thanks for the comment.
Adding an interceptor in a component is a side effect because we are manipulating something that is out of our scope of component.
you should eject previous interceptor in the clean up function and in the case you didn't, each time the useEffect is executed, one interceptor will be added to interceptors stack and this not the expected behaviour.
And be aware of new behaviour of strict mode in React 18 that execute effect twice in development mode. you can read more about that in this link Adding Reusable State to StrictMode
I created a codesandbox for the post react 18 codesandbox and a react 17 codesandbox
you can find out that the effects run twice in React 18.
Thanks to your explanation, I totally understand! Your writing saved me, and the comments helped me a lot!
I put eject code back because I thought I needed it and It works well! and also your explanation about strict mode in React 18 helped me! it much better! Thank you! 😊