小编May*_*dav的帖子

useCallback 和 useMemo 有什么区别

也许我误解了一些东西,但是每次重新渲染发生时 useCallback Hook 都会运行。

我传递了输入 - 作为 useCallback 的第二个参数 - 不可更改的常量 - 但返回的记忆回调仍然在每次渲染时运行我的昂贵计算(我很确定 - 你可以在下面的代码片段中自己检查)。

我已将 useCallback 更改为 useMemo - useMemo 按预期工作 - 在传递的输入更改时运行。并真正记住昂贵的计算。

现场示例:

'use strict';

const { useState, useCallback, useMemo } = React;

const neverChange = 'I never change';
const oneSecond = 1000;

function App() {
  const [second, setSecond] = useState(0);
  
  // This  expensive function executes everytime when render happens:
  const calcCallback = useCallback(() => expensiveCalc('useCallback'), [neverChange]);
  const computedCallback = calcCallback();
  
  // This  executes once
  const computedMemo = …
Run Code Online (Sandbox Code Playgroud)

reactjs react-hooks

0
推荐指数
2
解决办法
1528
查看次数

标签 统计

react-hooks ×1

reactjs ×1