Maison > interface Web > js tutoriel > le corps du texte

Comment puis-je résoudre « Les éléments JSX adjacents doivent être enveloppés dans une balise englobante » dans React.js ?

Mary-Kate Olsen
Libérer: 2024-10-30 08:08:27
original
410 Les gens l'ont consulté

How Do I Resolve

Erreur d'analyse : résolution de « Les éléments JSX adjacents doivent être enveloppés dans une balise englobante »

Lors d'une tentative de rendu conditionnel de composants dans une application React.js, les développeurs peuvent rencontrer l'erreur "Erreur d'analyse : les éléments JSX adjacents doivent être enveloppés dans une balise englobante." Cela se produit lorsque plusieurs éléments JSX sont placés directement les uns à côté des autres sans être contenus dans un composant parent.

L'erreur peut être corrigée en garantissant que tous les éléments JSX sont enfermés dans un seul composant parent, comme indiqué ci-dessous :

// Incorrect: Adjacent JSX elements will result in a parse error
return (
  <Comp1 />
  <Comp2 />
);
Copier après la connexion
// Correct: Enclose elements within a parent component
return (
  <div>
    <Comp1 />
    <Comp2 />
  </div>
);
Copier après la connexion

Alternativement, l'API React.Fragment peut être utilisée pour créer un composant parent virtuel sans ajouter de nœuds DOM supplémentaires :

// Fragments allow for grouping JSX elements without adding nodes to DOM
return (
  <React.Fragment>
    <Comp1 />
    <Comp2 />
  </React.Fragment>
);
Copier après la connexion

Par En enfermant les éléments JSX adjacents dans un composant parent approprié, les développeurs peuvent résoudre l'erreur « Les éléments JSX adjacents doivent être enveloppés dans une balise englobante » et s'assurer que leurs applications React s'affichent comme prévu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!