En mi método render he componente

<DatePicker selected={this.state.startDate} onChange={this.handleChange()}/>

handleChange es la siguiente

handleChange: function (e) {
  var that = this;
  console.log(e.target.value)
  return function () {
    that.setState({
      startDate: e.target.value
    });
  }
},

Por que cuando intento cargar la página con este componente, tengo un error

No se puede leer la propiedad ‘target’ undefined

¿Qué estoy haciendo mal ?

InformationsquelleAutor Alexey K | 2017-09-24

5 Comentarios

  1. 20

    El problema es que va a invocar a la función en esta línea:

    onChange={this.handleChange()}

    Todo lo que tienes que hacer es, simplemente, pasar a la función como un valor a onChange sin invocar.

    onChange={this.handleChange}

    Cuando se utiliza el paréntesis que sería la invocación de una función/método en lugar de enlazar con un controlador de eventos. Comparar los dos ejemplos siguientes:

    //invokes handleChange() and stores what the function returns in testA.
    const testA = this.handleChange()  

    vs

    //stores the function itself in testB. testB be is now a function and may be invoked - testB();
    const testB = this.handleChange 
    • Gran respuesta! Me ayudó a salir así.
    • ¿qué pasa si usted desea pasar un parámetro
    • como onMouseOver={(evento) => { este.moveBall(evento) }}
    • si quieres pasar un argumento – onMouseOver={ (e) => este.moveBall(e) }
  2. 1

    Si usted está pasando evento mediante una flecha función, usted debe tratar el siguiente:

    onChange={(e) => handleChange(e)}
  3. 0

    Simplemente hacer esto

    <DatePicker selected={this.state.startDate} onChange={this.handleChange}/>

    Va a pasar el evento param de la función de forma automática. El resto de tu código está bien.

  4. 0

    Ejecución de la función en vez de pasar como una patena.

    Usted necesita para cambiar esto,

     onChange={this.handleChange()}

    con esto,

     onChange={this.handleChange}
    • Ahora tengo Advertencia: bind(): son la unión de un método de componentes para el componente. Reaccionar lo hace de forma automática en un alto rendimiento, por lo que puede quitar la presente convocatoria. Ver ClientOrderList y cuando puedo activar la onChange – TypeError: No se puede leer la propiedad «valor» undefined
    • Él no necesita a enlazar. Enlazar obras en funciones, no los métodos. Echa un vistazo a mi respuesta
  5. 0

    Cambiar esta onChange={this.handleChange} a este onChange={() => this.handleChange()} también puede ayudar si todas las sugerencias anteriores no funcionan.

Dejar respuesta

Please enter your comment!
Please enter your name here