Insérer du HTML avec des instructions de variable React (JSX)
Dans le développement React, vous pouvez rencontrer le besoin d'incorporer du contenu HTML de manière dynamique à l'aide de la variable React déclarations (JSX). Cette question cherche une solution pour insérer du HTML stocké dans une variable dans un composant React et le rendre comme prévu.
La clé pour y parvenir réside dans l'utilisation de l'attribut dangereusementSetInnerHTML. Cet attribut vous permet de définir directement le HTML interne d'un élément, vous permettant d'injecter du contenu HTML de manière dynamique.
Pour utiliser l'attribut DangerlySetInnerHTML, vous pouvez modifier votre code comme suit :
<code class="javascript">render: function() {
return (
<div className="content" dangerouslySetInnerHTML={{__html: thisIsMyCopy}}></div>
);
}</code>Dans ce code, la variable thisIsMyCopy contient le contenu HTML que vous souhaitez insérer. L'attribut dangereusementSetInnerHTML définit ensuite le code HTML interne du fichier
Il est important de noter que l'utilisation de wonderfullySetInnerHTML doit être effectuée avec prudence, car elle peut introduire des vulnérabilités de sécurité potentielles. Il est recommandé de l'utiliser uniquement lorsque cela est nécessaire et de nettoyer soigneusement le contenu HTML avant de le configurer.
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!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
