多次在 API 调用上以反应原生方式呈现屏幕

Posted 2023-04-14

【中文标题】多次在 API 调用上以反应原生方式呈现屏幕

【英文标题】：Multiple times Screen render on API call in react native

【发布时间】：2021-08-09 14:05:27

【问题描述】：

我已将控制台日志放在我的功能组件文件中。每当调用 API 时，都会在此文件中呈现。如果我在其他文件中调用 API 并且与该文件无关的 API 仍然有日志。我不确定为什么。我已经检查了 useEffect 和 usestate 但没有任何线索。甚至从谷歌搜索没有线索。

我正在使用 Usestate 来存储和 useEffect 在数据更改时重新加载页面 我正在使用apisauce调用API 反应原生导航底部标签来导航屏幕 使用 React.memo 但仍然呈现页面。

请任何人帮我解决这个问题。因为我是新来的反应原生的。

【问题讨论】：

为什么不试试类组件？

现在不可能。因为我几乎完成了，功能组件对我来说很容易。还有我如何通过使用类组件来解决。 @Dipan Sharma

【参考方案1】：

只要状态或道具发生变化，React 组件就会自动重新渲染。从代码中的任何位置对状态进行简单更新，都会导致所有用户界面 (UI) 元素自动重新呈现。

但是，在某些情况下，render() 方法可能依赖于其他一些数据。在初始安装组件后，会在以下情况下发生重新渲染：

组件的 setState() 方法被调用。

组件的 forceUpdate() 方法被调用。

警告：您通常应该尽量避免使用 forceUpdate()，并且只在 render() 中读取 this.props 和 this.state。

【讨论】：

感谢您的回复@Mehroze Yaqoob。如何在本机反应中避免这个问题？你能帮帮我吗？

这不是问题，它是 react native 在 UI 上执行失效的方式。如果您认为过多的重新渲染会导致屏幕抖动，那么您需要应用适当的 if-else 检查以避免重新渲染。