Qu'est-ce que React StrictMode et comment l'utiliser
Vous pouvez utiliser leReact.StrictMode
composant intégré pour activer un ensemble de vérifications que React effectue et vous avertit.
Un moyen simple consiste à envelopper l'ensemble du composant App dans<React.StrictMode></React.StrictMode>
dans le fichier index.js:
import React from 'react'
import ReactDOM from 'react-dom'
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>
document.getElementById(‘root’)
Vous pouvez également l'utiliser en encapsulant un ou plusieurs composants de votre application:
import React from 'react'
class Hello extends React.Component {
render() {
return (
<div>
<React.StrictMode>
…
</React.StrictMode>
<div>
)
}
}
L'un des principaux cas d'utilisation de ce composant est d'être utilisé comme une vérification automatisée des meilleures pratiques, des problèmes potentiels et des dépréciations.
Il ne peut pas tout attraper, mais vous avez beaucoup de jolis chèques ici qui peuvent vous aider à réparer les fruits à portée de main.
Introduit dans React 16.3 en mars 2018, il n'a aucun impact en production, vous pouvez donc toujours laisser le composant dans la base de code. Utilisé en développement, il imprimera des avertissements utiles dans la console JavaScript du navigateur.
Téléchargez mon gratuitManuel React
Plus de tutoriels de réaction:
- Un exemple d'application simple React: récupérez les informations des utilisateurs de GitHub via l'API
- Construisez un compteur simple avec React
- Configuration de VS Code pour le développement de React
- Comment passer des accessoires à un composant enfant via React Router
- Créez une application avec Electron et React
- Tutoriel: créer une feuille de calcul avec React
- La feuille de route pour apprendre React
- Apprenez à utiliser Redux
- Premiers pas avec JSX
- Composants stylisés
- Introduction à Redux Saga
- Introduction à React Router
- Introduction à React
- Composants React
- Le DOM virtuel
- Réagir les événements
- L'état de réaction
- Accessoires de réaction
- Le fragment de réaction
- L'API de contexte React
- Réagir les types de prop
- Concepts React: déclaratif
- Réagir: comment afficher un composant différent en un clic
- Comment faire une boucle dans React JSX
- Props vs State dans React
- Devriez-vous utiliser jQuery ou React?
- Combien de JavaScript devez-vous connaître pour utiliser React?
- Introduction à Gatsby
- Comment référencer un élément DOM dans React
- Flux de données unidirectionnel dans React
- Réagir des composants d'ordre supérieur
- Événements de cycle de vie de React
- Concept de réaction: immuabilité
- Concept React: Pureté
- Introduction à React Hooks
- Introduction à create-react-app
- Concept de réaction: composition
- Réagir: composants de présentation vs composants de conteneur
- Fractionnement de code dans React
- Rendu côté serveur avec React
- Comment installer React
- CSS dans React
- Utilisation de SASS dans React
- Gestion des formulaires dans React
- Réagir StrictMode
- Portails de réaction
- Réagir les accessoires de rendu
- Test des composants React
- Comment passer un paramètre aux gestionnaires d'événements dans React
- Comment gérer les erreurs dans React
- Comment renvoyer plusieurs éléments dans JSX
- Rendu conditionnel dans React
- React, comment transférer des accessoires vers des composants enfants
- Comment obtenir la valeur d'un élément d'entrée dans React
- Comment utiliser le hook useState React
- Comment utiliser le hook useCallback React
- Comment utiliser le hook useEffect React
- Comment utiliser le hook useMemo React
- Comment utiliser le hook useRef React
- Comment utiliser le hook useContext React
- Comment utiliser le hook useReducer React
- Comment connecter votre application React à un backend de la même origine
- Le didacticiel du routeur Reach
- Comment utiliser les outils de développement React
- Comment apprendre React
- Comment déboguer une application React
- Comment rendre du HTML dans React
- Comment réparer l'erreur `dangerouslySetInnerHTML` ne correspond pas à l'erreur dans React
- Comment j'ai résolu un problème avec un état de formulaire de connexion React et le remplissage automatique du navigateur
- Comment configurer HTTPS dans une application React sur localhost
- Comment corriger l'erreur "Impossible de mettre à jour un composant lors du rendu d'un composant différent" dans React
- Puis-je utiliser des hooks React dans un conditionnel?
- Utiliser useState avec un objet: comment mettre à jour
- Comment déplacer des blocs de code avec React et Tailwind
- Réagissez, concentrez un élément dans React lorsqu'il est ajouté au DOM
- Réagissez, modifiez le texte en double-clic