问题标签 [react-usememo]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
33 浏览

reactjs - React - 如何处理需要在其依赖项中具有全局状态数组的 useMemo?

我有一些useMemo在其依赖项中具有全局状态(在本例中来自 redux)的钩子:

someGlobalStateArray是我从服务器接收的一个数组——所以每次我从服务器获取这个数组时都会产生不同的对象——所以 React 总是将它视为一个新对象,即使在大多数情况下这个数组中的值是相同的。

我该如何解决这个问题?

我考虑在设置状态之前执行深度手动检查,如果数组与前一个状态数组具有相同的内容,那么我会将新状态的数组设置为前一个数组,但这对我来说似乎不正确。

提前谢谢。

0 投票
1 回答
52 浏览

reactjs - 当依赖项是一个对象时,如何使用 useCallback、useMemo 和 React.memo?

我有useMemo当它的一个依赖项是Object我从服务器获得的,所以即使对象的内容是相同的 -useMemo因为对象本身每次都不同,所以在每次从服务器同步中一遍又一遍地调用它,当然 和 也是一样useCallbackReact.memo

我该如何解决这个问题?

我正在考虑手动检查新结果是否与以前的结果具有相同的内容,如果确实如此 - 保留以前的对象引用。

0 投票
1 回答
36 浏览

reactjs - ReactJS useMemo 内部函数

我有这个功能:

我试图用它useMemo()来记住的值,filteredData以便不执行该功能searchTable,因为它很慢。我在函数内部试过这个handleSearch

但我得到了Hooks can only be called inside of the body of a function component正确的信息。

我应该如何使用useMemo我的案例?

0 投票
0 回答
25 浏览

reactjs - 由于我已经有了状态,如何同时使用 useMemo 和 useCallback 来防止不必要的 API 调用?

我有两个按钮;

单击时,它们会返回一个列表以填充表格。

在此处输入图像描述

我想这样做:

和这个:

会阻止重新渲染地图中的数据列表吗?

换句话说,既然我已经进行了 API 调用,那么单击按钮会显示来自初始调用的数据吗?因此,一个活泼的体验......

我究竟做错了什么?

0 投票
0 回答
23 浏览

reactjs - 如何用useMemo包装平面列表的renderItem函数

有一个简单的 renderItem 函数,我只需要用“useMemo”包装它,但遇到如下错误; 在此处输入图像描述

原来的:

0 投票
0 回答
54 浏览

javascript - 在异步调用时记住值

我试图记住反应组件中的一些值,因为即使数据没有改变(并且不会改变),它也会重新渲染。使用 useEffect + useState 可以正确显示数据,但每次重新渲染组件时都会触发功能。目前我正在尝试实现 useMemo 钩子,但异步调用/承诺在渲染过程中没有解决,所以它甚至不加载数据。我将尝试提供最多的信息:

这是我的 AppRouter 组件,我创建合同并将其作为值传递给将在其他一些组件中使用的提供程序:

然后从我在管理路径中的自定义上下文中获取合同(这是我现在正在测试的),然后传递给它的一个孩子:

实际上,我正在使用带有 useState 和 useEffect 的自定义钩子来获取数据,但即使 tokenContract 根本没有改变,它也会重新呈现 TokenInfo 组件。这是我的自定义钩子:

我的 getERC20Info 函数,试图从区块链中获取数据,没有错,它工作正常:

提前感谢您的帮助!

0 投票
2 回答
61 浏览

javascript - 仅渲染有更改的组件

我有一个包含数千个字符串的数组并传递给一个组件:

主要成分:

ShowName 组件:


还有一个按钮可以随机更改名称。但是每当按下按钮时,所有ShowName组件都会重新渲染。我一直在尝试使用 useCallback 和 useMemo,但组件仍在重新渲染 x 次(x 是数组的长度)。

如果我只想通过更改重新渲染组件,该怎么办?

0 投票
0 回答
36 浏览

react-native - 如何使用 React.memo 防止图像在平面列表中重新加载

在我的 Redux 商店中,我保留了一个活动的 Report 对象。这个复杂的对象有一个照片对象数组,由一个带有 id 字段和 uri 字段的对象组成。例如,报表对象可能如下所示:

我将这些图像 uri(它们不是本地文件,它们指向 firestore 存储)加载到 FlatList 中,如下所示:

然后我用这个函数调用 renderItems:

最后,这是我的 AsyncImage 组件代码:

这是我的删除照片功能:

问题

当我向数组中添加一张新照片时,一切都很好。但是,当我从数组中删除一个元素时,尽管我使用了 React.memo,但一些(但不是全部)图像会重新加载。

我花了数小时和数天试图找出原因。我迷路了。我希望在这个问题上得到一些帮助

如果有人需要查看我的更多代码,请告诉我,但这对我来说看起来很简单

0 投票
2 回答
132 浏览

javascript - 为什么在这里使用 useMemo 而不是 useCallback?

因此,据我了解,两者之间的区别在于,如果返回函数、对象或数组,则使用 useCallback,而返回原语时使用 useMemo。但我正在查找去抖动(这是文章:https ://dmitripavlutin.com/react-throttle-debounce/ 它说 useMemo 将是一个更好的解决方案。使用 useCallback

带使用备忘录

我不明白。debounce 是否返回原始值?如果不是,我们如何使用 useMemo?还有在这里 useMemo 比 useCallback 更好吗?

0 投票
1 回答
45 浏览

javascript - 在反应中传递一个值而不在父级中写入状态

我正在尝试做的事情:我需要价格 * 数量 = 总量。我有一张表,价格为一,数量为一,总数为一。数量是一个计数器,需要有自己的状态,因为行将添加更多的计数器。但是我需要父表中的那个值,所以我可以用它来计算总数。

通常我会将计数器值放在父级中,但如果我这样做,当我更改一个计数器时,它们都会改变。那么我还能如何将值传递回父级呢?或者我在这里还有什么其他选择。

视觉参考: 在此处输入图像描述