Javascript 使用shouldComponentUpdate防止重新渲染器上的抖动

加载下一页的项目时，我的React应用程序出现问题。页面的某些部分在其他部分之前加载，而某些部分在快速切换到新页面的数据之前加载上一页面的数据。该功能运行良好，但看起来有点简陋

我通过添加状态来确定组件是否正在加载下一个页面，并仅在未加载时更新它，从而解决了这个问题

async nextPage(){
  this.setState({isLoading: true})
  await apiCall()
  this.setState({isLoading: false})
}

shouldComponentUpdate(nextProps, nextState, nextContext) {
    return !this.state.isLoading
}

---

这似乎是一种不好的做法，可能会导致不相关的后果。这个问题有没有更干净的解决方案？

对我来说似乎没问题/有效。另一种方法是在呈现返回中应用一些“加载”UI的条件呈现。shouldComponentUpdate旨在告诉React组件的输出不受props/state更改的影响。建议不要使用shouldComponentUpdate来防止在组件输出中实际发生更改时进行渲染。首选的做法是根据加载状态进行有条件的渲染（例如，加载完成后仅渲染元素，或在等待更新数据时渲染加载指示器组件代替元素）。对我来说似乎正常/有效。另一种方法是在呈现返回中应用一些“加载”UI的条件呈现。shouldComponentUpdate旨在告诉React组件的输出不受props/state更改的影响。建议不要使用shouldComponentUpdate来防止在组件输出中实际发生更改时进行渲染。首选做法是根据加载状态进行有条件的呈现（例如，加载完成后仅呈现元素，或在等待更新数据时呈现加载指示器组件代替元素）。