How to make an onclick automatically happen after 2 minutes in ReactJS Typescript-CodePudding

I am planning to make a buttons onClick function automatic after 2 minutes. This is my current button and the function I am calling is handle event videos.

How can I trigger that the button is automatically clicked after 2 minutes. I planned to create a new function and call the handleEventVideos() in there and then pass that function in useEffect. But that doesn't work. Can anyone please help me how I can do this?

                     <Button
                        disabled={isDisable}
                        type="submit"
                        onClick={() => handleEventVideos()}
                        variant="contained"
                        className={classes.doneButton}
                      >
                        Done
                      </Button>

CodePudding user response：

if you want to cal the onclick function in you sample, you can use setTimeout and call handleEventVideos function. It would be something like this:

document.addEventListener('DOMContentLoaded', function() {
  setTimeout(()=>{
    alert("your function of interest!")
  },2000);
});

However, it would be the case if you do not need the event variable in your function (like you example here). However, if you want to invoke the react click event by defining a ref and calling its click function. You can find an extended solution here: How to manually trigger click event in ReactJS? In case you wanted to call it with 2 second delay, you just have to use setTimeout function in the same fashion it is used above.

CodePudding user response：

//This  alert will pop up after 2 minutes. Instead of alert you can put 
your onclick function there.

const OnClick =()=> {
  setTimeout(()=>{
    alert("I will pop up after 2 minutes")
  },20000);
});