M
M
Michael R.2019-06-15 14:23:31
JavaScript
Michael R., 2019-06-15 14:23:31

ReactJS error - "This synthetic event is reused for performance reasons", what to do?

Greetings!
I am studying React according to the documentation, I reached the section with forms and there was a misunderstanding: if you save the field value like this: - everything works. But, going back to the State and Life Cycle section , we see that it is recommended to update `state` like this:this.setState({value: e.target.value})

e.persist();
this.setState(state => ({
  value: e.target.value
}));

Ok, recommended, no question. Error when executing code This synthetic event is reused for performance reasons. If you're seeing this, you're accessing the property `target` on a released/nullified synthetic event. This is set to null. If you must keep the original synthetic event around, use event.persist(). See https://fb.me/react-event-pooling for more information. . I'm going to look at that section. From everything read, the following thoughts are added: React returns an event not in a standard form, but in its own. To get a standard event, before updating `state`, you must additionally call e.persist(). Called, everything worked.
Question: did I understand everything correctly?
class App extends React.Component {

  constructor() {
    super();
    this.state = {value: 'Hello, world!'}
  }

  formUpdate = (e) => {

    // вариант 1
    this.setState({value: e.target.value});

    // вариант 2
    e.persist();
    this.setState(state => ({
      value: e.target.value
    }));

  }

  render() {
    return (
      <div>
        <h1>{this.state.value}</h1>
        <form>
          <label>Новое название:
            <input type="text" value={this.state.value} onChange={this.formUpdate}/>
          </label>
          <button type="submit">Изменить</button>
        </form>
      </div>
    );
  }

}

ReactDOM.render(<App/>, document.getElementById("root"));

Answer the question

In order to leave comments, you need to log in

1 answer(s)
0
0xD34F, 2019-06-15
@Mike_Ro

did I understand everything correctly?

"Get standard event" - where did you get that from? Experiencing problems with understanding the English text - you can try the Russian version .

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question