Использовать setState() в componentWillMount() технически безопасно, но это не рекомендуется в современной разработке на React. Этот метод жизненного цикла устарел и заменён на более удачные альтернативы.
componentWillMount() вызывается прямо перед тем, как компонент монтируется, и до того, как вызывается render(). Поскольку компонент ещё не отрендерился, вызов setState() в этом методе не спровоцирует переотрисовку, из-за чего это неэффективно для инициализации состояния.
Кроме того, этот метод жизненного цикла не должен содержать:
Вся асинхронная инициализация и API-вызовы должны быть в componentDidMount(). Этот метод вызывается после того, как компонент смонтировался, позволяя обновлениям состояния спровоцировать переотрисовку.
componentDidMount() {
axios.get('api/todos')
.then((result) => {
this.setState({
messages: [...result.data]
})
})
}
В современных React-приложениях используй хук useEffect() вместо методов жизненного цикла класса:
useEffect(() => {
axios.get('api/todos')
.then((result) => {
setMessages([...result.data])
})
}, [])
Хотя setState() в componentWillMount() технически безопасен, он не имеет практического смысла, потому что переотрисовки не происходят. Всегда используй componentDidMount() или useEffect() для логики инициализации и API-вызовов, чтобы обеспечить правильное поведение и производительность компонента.
Вызов setState() в componentWillMount() не вызовет перерендеринг, потому что компонент еще не был отрендерен в DOM.
Новый — ещё не проверен сообществом
Вы