首页 > 解决方案 > 将 html 添加到字符串 svelte

问题描述

嘿,我有几串文字

let text = [
    "<strong>Voiijer</strong>" +
      "is a global community of explorers of all ages who create and share expeditions",
    "Everyone is an explorer, now everyone can explore. Voiijer is for everyone, from students to scientists.",
    "Voiijer is for the naturally curious. <br />To tell the story of the world.",
  ];

我这样展示

<p>{text[index]}</p>

索引是 carousal 元素的索引,但 html 元素仅显示为文本。有人知道如何解决这个问题吗?

标签: javascripthtmlsvelte

解决方案


你可以用{@html text[index]}

但是,根据文档

在将 {@html ...} 内的表达式插入 DOM 之前,Svelte 不会对其进行任何清理。换句话说,如果您使用此功能,您必须手动转义来自您不信任的来源的 HTML,否则您可能会使您的用户面临 XSS 攻击。

您应该确保自己的字符串是安全的。


推荐阅读