javascript - 在不使用Preact标记的情况下在Preact中呈现原始HTML？

Preact标记为8.5kb，是Preact大小的一半。是否有一种无需解析就可以呈现原始HTML的方法？

我能想到的一种方法是呈现一个占位符，然后使用componentDidMount替换componentDidUpdate或innerHTML中的占位符，但是有没有那么黑黑的方法？

最佳答案

正如@pmkro在评论中提到的那样，您可以使用dangerouslySetInnerHTML呈现原始html字符串。

import { h, render } from "preact";

const vnode = <div dangerouslySetInnerHTML={{
  __html: "<span>foobar</span>"
}} />

render(vnode, document.getElementById("app"));
// renders <div><span>foobar</span></div>

有一点警告：您需要绝对确保以dangerouslySetInnerHTML结尾的字符串已正确转义。否则，您（和您的用户）将面临XSS注入攻击。因此，名称为dangerouslySetInnerHTML。

免责声明：我从事Preact。