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.