Devs-Fix | Quick Solutions for Real-World Code Errors

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 ...

TypeError: Cannot read properties of undefined (reading 'map') means you called .map() on something that does not exist. JavaScript evaluated the expression to the left of .map , got undefined , and stopped there. The distinction that matters: the array is not empty, it is absent . An empty array maps fine and renders nothing. undefined has no properties at all, so the property lookup itself throws before your callback ever runs. Older JavaScript engines print the same failure as Cannot read property 'map' of undefined . Same bug, older wording - everything on this page applies. Below: the one-line fix, then 11 distinct causes with a reproduction and a fix for each, then a checklist for when your case matches none of them. Error TypeError: Cannot read properties of undefined (reading 'map') Where it happens JavaScript - browser or Node.js, any framework. Most often React or Vue rendering a list from data that has not arrived, or a server response wh...