太多重新渲染或无法在回调中调用

在函数组件中使用useMemo或useCallback钩子函数以减少重新渲染，并确保将回调作为依赖项传递。

代码示例:

import React, { useState, useMemo, useCallback } from 'react';

function Example() {
  const [count, setCount] = useState(0);

  const handleIncrement = useCallback(() => {
    setCount(count + 1);
  }, [count]);

  const memoizedCount = useMemo(() => {
    return count * 2;
  }, [count]);

  return (
    <div>
      <button onClick={handleIncrement}>Increment</button>
      <p>Count: {count}</p>
      <p>Memoized Count: {memoizedCount}</p>
    </div>
  );
}