Toggle function in React

user_15259386 0
Viewed 73

So at the beginning I know this code is messy. I have a div that I want to copy, when I click on the div, it opens up a Content and it copies that div. The thing I can't seem to accomplish is this, In that copied version of div/Image, I can close the content, but when I press on it again, I can't seem to open the component. If you don't fully understand it here is the sandbox https://codesandbox.io/s/confident-lake-uovir?file=/src/App.js

reactjs javascript
1 Answers

You have ref in the first div so the click event can be checked with handleProject.

There are 2 functions run when you click the copied version.
onClick of the div triggers setIsProjectOpen(true), then the eventListenter you added to useEffect triggers setIsProjectOpen(false).
You can do this:

        <div
          onClick={(e) => {
            e.stopPropagation();
            setIsProjectOpen(!isProjectOpen)}};
          className={
            "smallProjects__container " + (isProjectOpen ? "active" : "")
          }
        >
user_147054830
Related