时间戳

首页 > 解决方案 > React：有没有办法缓存组件或防止每次渲染时出现多余的 HTTP 调用

reactjs - React：有没有办法缓存组件或防止每次渲染时出现多余的 HTTP 调用

问题描述

下面的简单代码沙箱显示导航到组件会触发新的渲染。React 分析器指出组件已被渲染，因为它们是第一次连续出现。我理解这是正确的 React 行为，因为每个安装/渲染都会生成触发重新渲染的新方法引用。然而，这意味着尽管没有任何改变，但仍会发出几个 http 请求。有什么方法可以防止每次用户导航到组件时都发出这些请求？

在codesandbox我尝试使用React.memowithuseCallback时，都没有重用初始渲染。

单击console选项卡以查看每次组件呈现时，它都会进行新的 ajax 调用。

https://codesandbox.io/s/github/pstephenwille/react-render-question

标签： reactjsreact-router

解决方案

为了避免多余的 HTTP 调用，您必须验证您的源服务器没有更新您的本地数据。如果您真的只想触发一次 HTTP 调用，您可以例如在您的App组件中执行它们或将状态和回调函数传递给您的Foo和Bar屏幕组件，以确保单个调用

推荐阅读