Le titre pourrait être : Au-delà de dangereusementSetInnerHTML : existe-t-il des moyens plus sûrs de restituer du HTML brut dans React ?

Rendu du HTML brut dans React avec une sécurité améliorée

Question :

Utilise-t-il dangereusementSetInnerHTML le seule méthode pour restituer du HTML brut dans React ?

Réponse :

Depuis les méthodes initiales décrites dans la question, des progrès ont été réalisés dans React pour garantir un rendu HTML plus sûr. Voici quatre options disponibles aujourd'hui :

1. Unicode

Encodez les caractères HTML en utilisant Unicode. Enregistrez le fichier au format UTF-8 et définissez le jeu de caractères sur UTF-8. Exemple :

<div>{'\u00b7'}</div>

2. Numéro Unicode

Intégrez le numéro Unicode dans une chaîne JavaScript.

<div>{String.fromCharCode(183)}</div>

3. Tableau mixte

Combinez des chaînes et des éléments JSX dans un tableau :

<div>{['First ', <span>&amp;middot;</span>, ' Second']}</div>

4. DangerouslySetInnerHTML (Dernier recours)

Utiliser dangereusementSetInnerHTML comme option finale :

<div dangerouslySetInnerHTML={{__html: 'First &amp;middot; Second'}} />

Recommandations :

Les trois premières méthodes sont préférées pour la sécurité et la maintenabilité. Utilisez dangereusementSetInnerHTML uniquement lorsque cela est absolument nécessaire.

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!