This is a Next.js app that gives an example of how to prevent double submit on a form using usActionState
and useFormStatus
. It was given as a StackOverflow answer.
It was boostrapped by running npx [email protected]
.
Note, there is a contrived 2.5 second delay while submitting the form to help with testing.
npm run dev
.- Navigate to http://localhost:300.
- Open your Network tab in dev console tools.
- Enter something in the text field.
- Press the Enter key on your keyboard to submit.
- Press the Enter key again while the previous submission is ongoing, you should not see another request.