Tengo este error y comencé a aprender React la semana pasada, así que no pude resolver el problema.

 Uncaught TypeError: contacts is not iterable at onSubmit (index.js:15:1)

Componente de contactos

 import List from "./List" import Form from "./Form" import {useState,useEffect} from "react" import React from "react" function Contacts(){ const [contacts,setContacts] = useState([]); useEffect(()=>{ console.log(contacts) },[contacts]) return ( <div> <List/> <Form addContact = {setContacts} contacts={contacts}/> </div> ) } export default Contacts

Componente de formulario

 import React from "react" import { useState } from "react" function Form(addContact,contacts){ const [form,setForm] = useState({fullName : "" , phoneNumber : ""}) const onChangeInput = (event) => { setForm({...form,[event.target.name]: event.target.value}) } const onSubmit = (event) => { event.preventDefault(); if(form.name ==="" || form.phoneNumber===""){ return false } addContact([...contacts , form]); } return ( <form onSubmit={onSubmit}> Form List <div><input name="fullName" placeholder="fullName" onChange={onChangeInput}></input></div> <div><input name="phoneNumber" placeholder="phoneNumber" onChange={onChangeInput}></input></div> <div> <button>Add</button> </div> </form> ) } export default Form