自定义 React Hook 是否应该导致依赖组件的重新渲染？

Question

我刚刚创建了一个自定义的钩子，用途useState和useEffect内部。

当我将该钩子导入另一个 React 函数组件时，调用它ComponentA，ComponentA每当自定义钩子中的状态发生变化时重新渲染。

ComponentA当它使用的钩子返回新值时，应该重新渲染是否正确？

有关其他问题的说明，请参阅代码中的注释。

代码：

const ComponentA = props => {
  const myValue = useMyValue();

  // COMMENTS:
  // Whenever myValue returns a new value, ComponentA re-renders
  // This in turn will cause the useMyValue() function to run.
  // Seems unnatural with such a circular effect.
  // Is my suspicion unfounded? Is this how it should work?
}

Answer 1

自定义可以简单地视为从功能组件内执行的函数，并且有效地将自定义钩子中存在的钩子转移到组件上。因此，如果自定义钩子中的代码直接编写在功能组件中，任何通常会导致组件重新渲染的更改都将导致重新渲染，即使该钩子是自定义钩子。