글

라벨이 a component is changing an uncontrolled input to be controlled인 게시물 표시

Error: A component is changing an uncontrolled input of type ... to be controlled. - 10 Causes and Fixes

이미지
React just logged Error: A component is changing an uncontrolled input of type ... to be controlled. in your console, and the input you were typing into probably still works - which is why this one is easy to ignore for weeks. It is not a crash; it is React telling you that a single <input> was mounted without a value prop (or with value={undefined} ) and then re-rendered with one. That switch matters because React manages the two kinds of inputs differently. An uncontrolled input keeps its text in the DOM node. A controlled input keeps it in your state and forces the DOM to match. Flipping between the two mid-life means React has to decide whose copy of the text wins, and the answer is not always the one you wanted - cursor jumps, wiped characters, and "my form resets when data loads" bugs all trace back here. This page covers the ten concrete ways a value prop goes from undefined to a string, each with a reproduction you can paste into a component, the lines ...