over 1 year ago
handleChange = (e) => {
    this.setState({[e.target.name]: e.target.value}, () => {
        console.log(e)  // <- e is an event with all of its properties set to null

    })
}

The code above prints an event object with nulls set to all of its properties. So you cannot access e.target.value or e.target.name as you normally would. This issue is explained in this thread:

Events are pooled so we wipe out their values. If you want to use the event outside the current event loop then you need to call ev.persist() which will pull that event out of the pooling.

I think what that means is that React resues a set of event objects instead of creating new event objects everytime an event comes up. persist() prevents it from cleaning:

handleChange = (e) => {
    e.persist()
    this.setState({[e.target.name]: e.target.value}, () => {
        console.log(e)  // <- now you can see all of the property values correctly

    })
}
← Django OneToOneField and Iterating Model's Fields Webpack devtool source map →
 
comments powered by Disqus