Nexca est un panneau d'administration que nous avons construit récemment et dans cet article, je vais expliquer chaque crochet pour mieux les comprendre et trouver la dernière mise à jour, vous les vérifiez ici.

utiliserRécupérer

Le hook useFetch est utilisé pour récupérer des données telles que des publications, des services ou des sections à partir d'une URL spécifiée. Ce hook prend un paramètre, qui est l'URL à partir de laquelle récupérer les données.

const data = useFetch('/api/posts/');

utiliserGetSection

Le hook useGetSection est utilisé pour récupérer les données d'une section spécifique. Ce hook est particulièrement utile pour la section client. Il faut trois paramètres :

1. url : URL à partir de laquelle récupérer les données, généralement un point de terminaison d'API pour les publications.
2. lengthItem : le nombre d'éléments que vous souhaitez afficher dans cette section.
3. secid : ID de la section pour laquelle vous souhaitez récupérer des données.

Vous pouvez également extraire l'état de chargement pour afficher un squelette pendant le chargement des publications.

const { data, loading } = useGetSection('/api/posts/', 8, 2);

utiliserGetLatestPosts

Le hook useGetLatestPosts est utilisé pour récupérer les dernières publications du site. Ce hook prend un paramètre :

• recentSize : nombre d'éléments récents que vous souhaitez afficher.

Il est recommandé de définir le nombre d'éléments que vous souhaitez voir à l'aide de useState.

const [recentSize] = useState(5);
const { posts } = useGetLatestPosts(recentSize);

useCheckLogin

Le hook useCheckLogin est utilisé exclusivement par l'administrateur pour vérifier si un utilisateur est connecté. Il ne prend aucun paramètre et ne doit être appelé que dans la page ou la présentation d'administration.

useSinglePost

Le hook useSinglePost est utilisé pour récupérer une seule publication en fonction d'un paramètre ID. Il trouve la publication correspondante et l'affiche à l'utilisateur. Ce hook n'est utilisé que sur la page /Posts/[id].

const post = useSinglePost();
// To read data from the post
{post.title}

utiliserLireTexte

Le hook useReadText est utilisé pour lire un texte donné à l'aide de la capacité de synthèse vocale du navigateur. Il fournit des fonctionnalités pour démarrer et arrêter le processus de lecture. Ce hook prend un paramètre :

• text : Le texte à lire à haute voix.

Le hook maintient un état isSpeaking pour indiquer si le texte est en cours de lecture. Il renvoie trois valeurs :

1. isSpeaking : un booléen indiquant si le texte est en cours de lecture.
2. handleReadText : Une fonction pour commencer à lire le texte.
3. handleStopReading : Une fonction pour arrêter la lecture du texte.

import { useReadText } from './useReadText';

const ExampleComponent = () => {
  const { isSpeaking, handleReadText, handleStopReading } = useReadText('Hello, this is a sample text.');

  return (
    

      Read Text
      Stop Reading
    
  );
};

Démo en direct

Nom d'utilisateur : administrateur
Mot de passe : a123b456@@