Есть loading, который сообщает, пришли данные или нет. Дело в том, что данные могут прийти за считанные доли, соответственно лоадер пропадает очень быстро. Как сделать плавную загрузку данных? То есть, к примеру, после загрузки данных грузить прелоадер еще 1 секунду. Сделал через стейты, а именно:
constructor(props) {
super(props)
this.state = {
contentReady: false
}
}
getProducts() {
setTimeout(() => {
this.setState(prevState => ({
contentReady: true
}))
}, 1000)
}
render() {
const { list, loading, error } = this.props
if (list.length > 0) {
this.getProducts()
}
if (error) {
return (
<div>Something went wrong while fetching products. Please, try again later.</div>
)
}
if (this.state.contentReady) {
return (
<div>Данные</div>
)
}
return (
<Preloader/>
)
Но постоянно выдается следующая ошибка: Can't call setState (or forceUpdate) on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
Что нужно изменить? И хорошая ли практика делать именно так?