より安全な方法を使用して React で生の HTML をレンダリングする

React では、危険な SetInnerHTML の使用を回避し、より安全な方法を使用して生の HTML をレンダリングできるようになりました。 。ここには 4 つのオプションがあります:

1. Unicode エンコーディング

UTF-8 でエンコードされたファイル内の HTML エンティティを表すには Unicode 文字を使用します:

{`First \u00b7 Second`}

2. JSX 文字列内の Unicode 番号

HTML エンティティを JSX 文字列内の Unicode 番号に変換します:

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

3.文字列と JSX 要素の混合配列

文字列と JSX 要素を組み合わせて複雑な HTML をレンダリングします:

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

4. DangerouslySetInnerHTML を最後の手段として使用する

dangerouslySetInnerHTML は潜在的なセキュリティ上の脆弱性を引き起こすため、最後の手段としてのみ使用してください。 2番目`}} />