0

Tengo un componente hijo que es un modal en el que tengo un handleChange para que cuando se haga click sobre un botón específico el modal se cierre. Luego, este modal (que solo tiene la estructura básica, título y botones) está siendo usado por dos diferentes tipos de modales (con contenido distinto). Estos modales, a su vez, están siendo usados por un formulario, que cuando le doy click a un par de checkboxes estos se abren.

Lo que necesito hacer es que cuando haga click en el botón de cerrar modal, se deseleccione el check respectivo que abre dicho modal en el formulario.

¿Cómo hago para usar esos estados y realizar dicha función? Cabe aclarar que estoy usando COMPONENTES FUNCIONALES.

Muchas gracias.

4
  • 3
    ¿Podrías incluir el código de tus componentes por favor? Así podemos darte una ayuda más personalizada. el 2 ago. 2022 a las 2:54
  • Es código de mi trabajo, por lo que no puedo compartirlo :(
    – Lore12
    el 2 ago. 2022 a las 10:41
  • 1
    Al menos podrías hacer una reconstrucción con un formato similar. Porque sin código se nos va a ser difícil ayudarte. el 2 ago. 2022 a las 15:27
  • Por favor lee Cómo preguntar y has el recorrido de bienvenida para que tu pregunta sea mejor recibida el 3 ago. 2022 a las 15:36

1 respuesta 1

0

Es un poco difícil darte una respuesta certera sin ver el código pero lo que recomendaría es lo siguiente:

En el componente padre:

  1. Generar una función, por ejemplo, "callbackModal" y pasarla mediante props al componente hijo.
  2. En esta función realizar la validación correspondiente para ver el estado del componente hijo a través de alguna variable "estado".
  3. A través de un setstate, cambiar el estado del check.
const callbackModal = (estado) => {
  if(!estado) {
    ...
    setState(prevState => {return {...prevState, estadoCheck: false};}); 
  }
}

En el componente hijo:

  1. Generar un handle para el onChange/onClick en donde llames a la función callback.
  2. En esa función enviar la variable "estado".
...
estado = true;
const handleClick = () => {
  estado = false;
  props.callbackModal(estado);
  setState(prevState => {return {...prevState, modal: false};});
}
...
1

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.