React: [error] Los eventos React onChange Synthetic / Proxy se están reciclando, problema cuando se elimina el rebote del controlador

Creado en 20 sept. 2016 · 3Comentarios · Fuente: facebook/react

¿Cuál es el comportamiento actual?

Confirmado a partir de 0.14.7 pero también ocurre hoy en 15.3.2.

class Foo extends React.Component {
    render(){
    const handleChange = _.debounce(this.props.onChange, 500);
    return <input onChange={handleChange} />
  }
}

ReactDOM.render(<Foo onChange={e => console.log(e.target, e)} />, document.querySelector('div'));

espere obtener e.target , obtenga null

sin el rebote, funciona como se esperaba. https://jsfiddle.net/dimitar/7ktbfetb/1/

posiblemente relacionado con https://github.com/facebook/react/commit/3285d834402a60d241188a1deacf8250b50239cf - para https://github.com/facebook/react/blob/master/CHANGELOG.md#react -9

Fuente

DimitarChristoff

Comentario más útil

Para cualquiera que busque una solución alternativa, puede usar e.persist()

p.ej. return <input onChange={e => handleChange(e.persist()||e)} />

DimitarChristoff en 20 sept. 2016

👍3

Todos 3 comentarios

Para cualquiera que busque una solución alternativa, puede usar e.persist()

p.ej. return <input onChange={e => handleChange(e.persist()||e)} />

DimitarChristoff en 20 sept. 2016

👍3

Esto se debe a cómo funciona el rebote. Va a usar setTimeout para enviar una llamada al siguiente ciclo de eventos. Como notó, debido a la agrupación, esto significa que React ya devolvió el evento sintético al grupo y restableció los campos. Si está utilizando rebote o cualquier otra cosa que requiera que el evento exista fuera del controlador de eventos de React (por ejemplo, código asíncrono), entonces debe persistir.

Esto es así por diseño, por lo que no hay nada que hacer al respecto en este momento. Hay una discusión en el #6190 sobre la posible eliminación de la agrupación, lo que debería hacer que su código funcione sin una persistencia explícita.

zpao en 21 sept. 2016

👍2

esto va en contra de los principios mismos que reaccionan para resolver en torno al flujo de datos, la inmutabilidad y la evitación de efectos secundarios. está pasando un objeto a un componente, pero es solo una instantánea que debe usarse dentro del mismo ciclo de eventos porque desconfía del GC y de los usuarios que pueden crear una fuga sin darse cuenta ...

Si bien puede haber sido una buena idea en ese momento, algunos de nosotros solo necesitamos admitir navegadores perennes que sean capaces de GC adecuados. tal vez, en el ínterin, mientras se reconsidera este enfoque, se puede establecer una variable flag/env para desactivar la agrupación.

DimitarChristoff en 21 sept. 2016

👍1

¿Fue útil esta página

0 / 5 - 0 calificaciones