ReactJS - useDebugValue 钩子

在本文中，我们将了解如何在 ReactJS 中使用 **useDebugValue** 钩子调试自定义钩子。

此钩子为自定义钩子提供自定义标签，以便使调试过程更加容易高效。只有在 React 开发工具被切换为开启状态时才会调用此钩子。

语法

useDebugValue(value,()=>{})

参数

• 值 - 自定义钩子的标签。

• ()=>{} - 格式化标签的函数。

示例

在此示例中，我们将构建一个 React 应用程序，用于显示我们 React 应用程序的自定义钩子的自定义标签。

App.jsx

function useCustomHook(val) {
   const [value, setValue] = useState(null);
   useDebugValue(value ? Not Empty : Empty);
   return value;
}

输出

它会在 React 开发工具中 **useCustomHook** 旁边显示标签。例如，如果值状态为“empty”，则该标签的值为“Empty”。

Rahul Bansal

更新于： 19-3-2021

234 次浏览量

开启你的 职业生涯

完成课程获取证书

开始学习