Hook-ul useDebugValue este dedicat exclusiv dezvoltatorilor care creează hook-uri personalizate (custom hooks). El permite atașarea unei etichete descriptive care va apărea vizibil lângă hook-ul respectiv în panoul de inspecție din React DevTools, facilitând depanarea rapidă a stărilor interne complexe.
Exemplu de etichetare cu formatare leneșă
import { useState, useEffect, useDebugValue } from 'react';
export function useStareConexiune() {
const [online, setOnline] = useState(true);
useEffect(() => {
const handleOnline = () => setOnline(true);
const handleOffline = () => setOnline(false);
window.addEventListener('online', handleOnline);
window.addEventListener('offline', handleOffline);
return () => {
window.removeEventListener('online', handleOnline);
window.removeEventListener('offline', handleOffline);
};
}, []);
// În DevTools va apărea eticheta: "Stare rețea: Conectat (Online)"
useDebugValue(online, status => `Stare rețea: ${status ? 'Conectat (Online)' : 'Deconectat'}`);
return online;
}
Întrebări & Exemple de Cod:
Hook-ul useDebugValue: Etichetarea Hook-urilor Personalizate în DevToolsAi o nelămurire despre utilizarea comenzii
Hook-ul useDebugValue: Etichetarea Hook-urilor Personalizate în DevToolssau ai descoperit un truc / fragment de cod util? Distribuie-l cu ceilalți programatori!Fii primul care pune o întrebare sau distribuie un fragment de cod / prompt!
Nu au fost adăugate încă întrebări sau exemple de cod pentru această pagină. Dacă ai întâlnit o problemă sau ai un snippet util, adaugă-l mai jos pentru a-i ajuta pe ceilalți.