[SOLVED] Is this the right approach for toggling a menu button?
https://codesandbox.io/s/sad-maxwell-2b7vv?fontsize=14
Edit: For clarification, this needs to use React hooks.
I have it transforming from = to x and vice versa, however, I had to hard code the reverse animation because I couldn't seem to get it to work by using the reverse or reveresed methods like shown below.
if (isMenuOpen) timeline.play()
else (timeline.reversed(true).play()
See the Pen by s (@s) on CodePen
First I should say the only reason timeline is in the 2nd argument array for useEffect is because codesandbox's linter suggests it, but it's not required. I've actually changed it to an empty array like the React docs suggest.
If there is no array for that 2nd argument, the useEffect method runs on every re-render. If there is an empty array, it runs on the first render only, the same behavior as componentDidMount. If there is a prop in that array, it will only run on a re-render if
