通常、文字列はプレーンテキストとして挿入されるため、<
や>
などの文字は特別な意味を持ちません。
しかし、HTML をコンポーネントに直接レンダリングする必要がある場合があります。たとえば、現在読んでいる単語は、このページに HTML の塊として含まれている markdown ファイルに存在します。
Svelte では、特別な {@html ...}
タグを使用してこれを行います。
アプリ
<p>{@html string}</p>
重要: Svelte は、
{@html ...}
内の式が DOM に挿入される前に、いかなるサニタイズも行いません。コンテンツが自分で書いた記事など、信頼できるものである場合は問題ありません。ただし、記事へのコメントなど、信頼できないユーザーコンテンツの場合は、手動でエスケープすることが不可欠です。そうしないと、クロスサイトスクリプティング (XSS) 攻撃にユーザーをさらすリスクがあります。
前へ 次へ
1
2
3
4
5
6
<script>
let string = `this string contains some <strong>HTML!!!</strong>`;
</script>
<p>{string}</p>