Sometimes, we want to prevent multiple times button press with React.
In this article, we’ll look at how to prevent multiple times button press with React.
How to prevent multiple times button press with React?
To prevent multiple times button press with React, we can set the disabled prop of the button.
For instance, we write
import React, { useState } from "react";
const Button = () => {
const [double, setDouble] = useState(false);
return (
<button
disabled={double}
onClick={() => {
// ...
setDouble(true);
}}
/>
);
};
export default Button;
to set disabled to the double state.
And we call setDouble with true to set double to true after the first click.
Conclusion
To prevent multiple times button press with React, we can set the disabled prop of the button.