Chrome 开发工具显示所有名为“State”的 useState 钩子

Question

我正在尝试检查开发工具中的 React Hooks 组件，但无论组件如何，我的所有 useState 挂钩都显示为

Hooks

State: false
State: null
Effect: fn()

false 的值是正确的，但我不知道哪个钩子是哪个钩子，因为出于某种原因，它们不会显示钩子变量名。

这是我设置每个钩子的方法：

const [myHook, setMyHook] = useState(false);

Answer 1

见https://stackoverflow.com/a/58579953/1930509

const [item, setItem] = useStateWithLabel(2, "item");

function useStateWithLabel(initialValue, name) {
  const [value, setValue] = useState(initialValue);
  useDebugValue(`${name}: ${value}`);
  return [value, setValue]; 
}