0

Tenho 3 componentes

Component Child 1 - Este tem um input do tipo checkbox e preciso de passar a informação que está checked para o Component Pai

const onInputChange = (event) => {
    setChecked(!checked);
}

<input
            type="checkbox"
            disabled={props.isDisabled
            defaultChecked={checked}
            onChange={onInputChange}
/> 

O component child 2 chama apenas o meu component child 1

E o meu component parent chama o child 2

Como passar passar para o Parent que o input do Child 1 está checked?

1 Resposta 1

-2

Vou dar alguns exemplos de como vc pode fazer isso

  1. Vc pode utilizar o hook useState no Parent, ai a função que seta esse state vai ser passada para os componentes, para que eles possam alterar o valor daquele state que está no Parent.
  2. Vc pode usar tbm Redux, que seria um estado global onde todos os componentes podem receber os dados salvos em um state global (mas isso seria bom caso vc queira fazer algo mais complexo).
  3. Vc tbm pode usar o ContextAPI, que tem uma lógica parecida do Redux, mas é mais simples de utilizar.

Um exemplo disso com hooks seria esse:

O código pra vc testar está no link

import React, { useState } from 'react';

function Parent() {
  const [checked, setChecked] = useState(false);
  console.log(checked);
  return (
    <Child2 props={ [checked, setChecked] } />
  )
}

function Child2({props}) {
  const [ checked, setChecked ] = props;
  return (
    <Child1 props={ [checked, setChecked] } />
  )
}

function Child1({props}) {
  const [ checked, setChecked ] = props;
  const onInputChange = (event) => {
    setChecked(!checked);
 }

  return (
    <input
        type="checkbox"
        disabled={props.isDisabled}
        defaultChecked={checked}
        onChange={onInputChange}
    /> 
  )
}
1
  • Obrigada., vou experimentar
    – noname
    Commented 26/01/2023 às 14:07

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .