family_budget

React

• Метод render() должен оставаться чистой функцией, то есть не вызывать сайд-эффектов, в том числе изменения state компонента и вызова колбэков в родительском компоненте. Этот метод предназначен только для отрисовки содержимого. Методы стадии обновления не должны вызывать изменения state или способствовать изменению props. Это вводит вашу программу в бесконечную петлю выполнения и переполняет стек вызовов.
• Метод shouldComponentUpdate() нужен для сравнения текущего состояния со следующим и отмены ненужной перерисовки компонента в зависимости от ваших условий (return false).
• Метод componentDidUpdate() нужен для вызова сайд-эффектов после перерисовки компонента, например, вызова сторонних модулей для обработки обновленного списка.
• Метод getSnapshotBeforeUpdate() используется как вспомогательный для componentDidUpdate().
• Метод componentWillUnmount() не должен вызывать новые действия с компонентом, так как он будет уничтожен сразу после завершения выполнения этого метода. Если вы вызовете setState() в этом методе, консоль выдаст ошибку, ведь вы предложили изменить state компонента, который уже удалили.
• Изменив состояние компонента this.setState({param: 1}) мы не можем быть уверены, что в следующей функции запросив его значение мы получим именно то, что установили ранее, т.к. фактически состояние меняется асинхронно. НО есть 2 способа получить актуальное значение:
  • вызвать следущую функцию отложенно window.setTimeout(..., 0)

  • передавать в state не значение, а функцию, которая вернет значение. setState({a: a + a})

    setState(count => count + 1)

This site is open source. Improve this page.