Опасения по поводу утечек памяти у слушателей реагирующих событий - PullRequest
Новая
       16

Опасения по поводу утечек памяти у слушателей реагирующих событий

0 голосов
/ 14 мая 2019

Будет ли реагировать заботиться о слушателях событий и удалять их при изменении состояния?Посмотрите на код ниже, я использовал onClick для HtmlElement.Сам элемент может быть удален при изменении состояния.Буду ли я реагировать на очистку прослушивателя событий или мне придется очищать каждого слушателя каждый раз при удалении пользователя? 

class Users extends React.Component {
  constructor(props) {
    super(props);
    this.state = { data: this.props.data };
  }
  remove = (i) => {
    this.state.data.splice(i,1);
    this.setState({data: this.state.data});
  };
  render() {
    const { data } = this.state;
    return (
      <div>
        {data.map((user, i) => {
          return <div key={i}>
            <span>{user.name}</span>
            <input type='button' value='remove' onClick={(e) => this.remove(i)} />
          </div>
        })}
      </div>
    );
  }
}

1 Ответ

0 голосов
/ 14 мая 2019

Вам не нужно беспокоиться об очистке. Реакт позаботится об этом за вас. React использует виртуальный DOM, так что в этом ключевое отличие.

Вы можете оптимизировать свой код, удалив функцию стрелки из вашего onClick и связав вместо нее существующую функцию.

Больше информации и примеров здесь:

https://reactjs.org/docs/faq-functions.html#bind-in-constructor-es2015

И вот несколько объяснений того, почему функция стрелки может быть не лучшим вариантом:

https://reactjs.org/docs/faq-functions.html#arrow-function-in-render

...