cómo enviar accesorios de niño a padre en el ejemplo de código de react js

Ejemplo 1: pasar datos del componente hijo al componente padre reaccionar nativo

classParentextendsReact.Component
  state = message:""callbackFunction=(childData)=>this.setState(message: childData),render()return(<div><Child1 parentCallback =this.callbackFunction/><p>this.state.message</p></div>);classChild1extendsReact.ComponentsendData=()=>this.props.parentCallback("Hey Popsie, How’s it going?");,render()//you can call function sendData whenever you'd like to send data from child component to Parent component.;

Ejemplo 2: pasar elemento de hijo a padre reaccionar

Parent:<div className="col-sm-9"><SelectLanguage onSelectLanguage=this.handleLanguage/></div>Child:handleLangChange=()=>var lang =this.dropdown.value;this.props.onSelectLanguage(lang);

Ejemplo 3: pasar accesorios de padre a hijo reaccionar componente funcional

importReact, useState from'react';import'./App.css';importTodofrom'./components/Todo'functionApp()const[todos, setTodos]=useState([
          id:1,
          title:'This is first list',
          id:2,
          title:'This is second list',
          id:3,
          title:'This is third list',]);return(<div className="App"><h1></h1><Todo todos=todos/>//This is how i'm passing props in parent component</div>);exportdefaultApp;functionTodo(props)return(<div>props.todos.map(todo=>// using props in child component and loopingreturn(<h1>todo.title</h1>))</div>);

Ejemplo 4: cómo pasar el estado de padre a hijo en react

classSomeParentComponentextendsReact.Componentconstructor(props)super(props);this.state=color:'red';render()return<SomeChildComponent color=this.state.color/>;

Si entiendes que ha sido de provecho nuestro post, sería de mucha ayuda si lo compartes con más seniors de esta manera nos ayudas a dar difusión a esta información.

---

---

Utiliza Nuestro Buscador