I was building a component which the user can use to add tags to an item, however I forgot how react's render model works, and had to go back to the basics.
The component has a controlled input, which is necessary to prevent the user from adding the same tag multiple times. I wanted to make it so that pressing enter while the tag input was focused would add the tag to the set of tags, since that is faster than reaching out for the button, so I added an event to the document that would do just that, however i made it so that the tag that would be added would be the value of the controlled input, but since useEffect only runs when any of its dependencies changes, but I was also using that function somewhere else, so I could not declare it inside of useEffect. Thus I ended up just not declaring dependencies for that effect, which causes it to run everytime the component is rerendered.
Here's the final component. The actual component that I'm using is a bit more complicated, since it loads all tags from the previous items, and puts them in a box of suggested tags, I'm using redux to store the tags globally, but anyway, the concept is basically the same.
Want to leave a comment?
>still quite don't know
*still don't quite know*
I guess I need to proof read my posts more carefully
don't be a faggot and use vanilla js
no