Estoy pasando una función que cambia los estados del componente principal al segundo componente y luego del segundo componente al tercer componente y llamo desde allí.
Esto da como resultado el siguiente error:
TypeError: no se puede desestructurar la propiedad 'posición' de 'indefinido' ya que no está definido
El siguiente es mi código de referencia:
export class ParentComponent extends Component { constructor(props) { super(props); this.state = { address: '', position: { lat: 0, lng: 0, }, }; this.locationChangeHandler = this.locationChangeHandler.bind(this); } locationChangeHandler({ position, address, places }) { // Set new location this.setState({ position, address }); } render(){ <SecondComponent locationChangeHandler={this.locationChangeHandler}/> }Segundo Componente:
<ThirdComponent locationChangeHandler={locationChangeHandler}/>Tercer Componente:
<FourthComponent onChange={locationChangeHandler()}/>¿Cómo resuelvo esto? Soy relativamente nuevo en ReactJs y agradecería toda ayuda.
¿Puedes cambiar la función locationChangeHandler de esta manera?
locationChangeHandler(loc) { // Set new location if(loc && loc.position && loc.address) this.setState({ position: loc.position, address: loc.address }); }