Cuando envío un objeto/problema, invoco una función del componente principal, que se ha pasado al componente secundario como accesorios. Después de enviar mis datos, quiero borrar mis campos de entrada. El problema es que estoy borrando mis campos de entrada inmediatamente después de llamar a addNewIssue(). De hecho, quiero esperar hasta que se resuelva la POST-Call.
Si solo tuviera un componente, podría borrar los campos de entrada después, por ejemplo, setissueList (newIssueList), ya que el estado y la llamada de descanso estarían en el mismo componente.
¿Cómo puedo notificar al componente secundario que la POST-Call se resolvió y solo entonces debería borrar las entradas?
Traté de buscar en Google este problema, pero no pude encontrar nada. Lo más probable es que no esté usando las palabras correctas. Supongo que tiene que ver con las promesas y la solución puede ser simple, pero no soy un experto en promesas o asíncrono.
// parent component const addNewIssue = (issue) => { axios.post(url + '/forms/issue', issue, headers).then((res) => { let newIssueList = [...issueList, res.data]; setissueList(newIssueList); }); } <NewIssue addNewIssue={addNewIssue} /> // child component const const handleSubmit = (e) => { e.preventDefault(); addNewIssue(inputs); setInputs({ summary: "", description: "" }); }Use su solicitud de API junto con una devolución de llamada
// parent component const addNewIssue = (issue,cb) => { axios.post(url + '/forms/issue', issue, headers).then((res) => { let newIssueList = [...issueList, res.data]; setissueList(newIssueList); cb() }); } <NewIssue addNewIssue={addNewIssue} /> // child component const const handleSubmit = (e) => { e.preventDefault(); const cb=()=>{setInputs({ summary: "", description: "" });} addNewIssue(inputs,cb); }