Estoy tratando de guardar la entrada de un formulario dentro de una matriz usando useState. Creé una función para hacer clic en un botón Agregar, pero la entrada onChange no se agrega a la matriz de notas cuando hago clic en el botón. Matriz vacía en el registro de la consola. Por favor, tenga la amabilidad de señalar el problema.
const {useState} = React; function CreateArea() { const [newNote, setNote] = useState({ title: "", content: "", }); const [notes, setNotes] = useState([]); console.log(notes); function addNote() { setNotes((prevNote) => { return [...prevNote, newNote]; }); } function handleChange(event) { const { value, name } = event.target; setNote((prevValue) => { return { ...prevValue, [name]: value, }; }); } return ( <div> <form> <input onChange={handleChange} name="title" placeholder="Title" value={newNote.newTitle} /> <textarea onChange={handleChange} name="content" placeholder="Take a note..." value={newNote.newContent} rows="3" /> <button onClick={addNote}>Add</button> </form> </div> ); } ReactDOM.render(<CreateArea />, document.getElementById("root")); <div id="root"></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.2/umd/react.development.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.2/umd/react-dom.development.js"></script>