在React中使用EmojiOne

Question

我一直在尝试使用带有标准React.js的EmojiOne和标准.toImage (参见docs ://.toImage下面是我的代码，或多或少

//react imports
import emoji from 'emojione';
//class component etc. render
return(
//other things from component
    {emoji.toImage(':smile:')}
)

这给了我

link to image

下面是它在inspect元素中的样子：

link to image

因此，据我所知，emojione库将图像代码作为文本放入React中，而不是作为元素。知道为什么吗？

谢谢!

Answer 1

React正在转义来自EmojiOne的输出，以避免跨站点脚本攻击。你可以(但也许不应该...)使用dangerouslySetInnerHTML将EmojiOne的输出注入为“实际的”HTML。

有人已经编写了一个可能有用的React EmojiOne包装器：https://github.com/pladaria/react-emojione

有关dangerouslySetInnerHTML的更多信息以及应该避免的原因，请查看：https://facebook.github.io/react/tips/dangerously-set-inner-html.html