Roh-HTML in React mit sichereren Methoden rendern

In React können Sie jetzt Roh-HTML mit sichereren Methoden rendern und so die Verwendung von hazardlySetInnerHTML vermeiden . Hier sind vier Optionen:

1. Unicode-Kodierung

Verwenden Sie Unicode-Zeichen, um HTML-Entitäten in einer UTF-8-kodierten Datei darzustellen:

{`First \u00b7 Second`}

2. Unicode-Zahlen in JSX-Strings

Konvertieren Sie HTML-Entitäten in Unicode-Zahlen innerhalb von JSX-Strings:

{`First `   String.fromCharCode(183)   ` Second`}

3. Gemischtes Array aus Strings und JSX-Elementen

Kombinieren Sie Strings und JSX-Elemente, um komplexes HTML zu rendern:

{[`First `, ·, ` Second`]}

4. DangerouslySetInnerHTML als letzten Ausweg

Verwenden Sie hazardlySetInnerHTML nur als letzten Ausweg, da es potenzielle Sicherheitslücken mit sich bringt: