Web Development

React form submits twice in development mode

Environment

Environment

React 19 application with Strict Mode and a custom effect-driven submit handler.

What happens

What happens

One click creates two API records locally, while production usually creates one.

What I have tried

What I have tried

Disabled the button after clicking, but duplicate requests still appear.

I would appreciate advice on how to identify the root cause without risking existing data or configuration.

COMMUNITY RESPONSES

Verified community troubleshooting

0 replies

No answers yet..

Showing 0 of 0 community responses
AI DIAGNOSTICS

Incident analysis

Updated 3w ago• Trouble ID

Most likely causes

A side effect performs the mutation and is intentionally re-run by Strict Mode. 73%
A recent software, firmware or configuration change is exposing an existing compatibility issue. 43%

Summary

The reported behaviour is consistent with a side effect performs the mutation and is intentionally re-run by Strict Mode. The safest next step is to verify that hypothesis with a reversible test before making permanent configuration changes.

Suggested Fixes

Verify the likely cause
Move submission into the event handler, make the API idempotent and keep effects limited to synchronization with external state.
Validate and monitor
Reproduce the issue once after the change, review relevant logs or metrics, and keep a rollback path until the system has remained stable.