2

在用户生成的帖子中,我有许多原始表情符号,例如

   <p>I ❤ your post!</p> 

我想知道用彩色表情符号替换这些表情符号的最佳方法是什么,例如:

 <p>I <i class="twa twa-heart">❤️</i> your post!</p>

我想用twemoji库来设计表情符号。

您可能会问为什么不让用户在选择表情符号时首先插入样式化的表情符号?答案是界面的文本编辑器不是所见即所得的,并且用户帖子被严重剥离。所以这种选项被排除在外,我正在寻找一种在渲染时进行这种转换的解决方案。

4

2 回答 2

4

查看 twemoji 的文档.... https://github.com/twitter/twemoji#api

API

以下是twemoji命名空间中公开的所有方法。

twemoji.parse(...) V1

这是主要的解析实用程序,每种解析类型有 3 个重载。

解析主要有两种:字符串解析DOM解析

您可以解析字符串(解析它们的输入)。

我相信您正在寻找这样的东西

但是,对于已经清理过的字符串,可以认为这种方法足够安全。如果安全性是您主要关心的问题之一,请参阅 DOM 解析。

twemoji.parse('I \u2764\uFE0F emoji!');

// will produce
/*
I <img
  class="emoji"
  draggable="false"
  alt="❤️"
  src="https://twemoji.maxcdn.com/36x36/2764.png"/> emoji!
*/
于 2019-05-30T14:00:03.627 回答
2

使用一个对象,其中键是剥离的表情符号,值是完整的 HTML 内容。遍历字符串中的每个字符并检查它是否是剥离的表情符号。如果是这样,请更换它。最后,将它们连接在一起并写入页面。

const raw = "<p>I ❤ your post!</p>";
const emojis = {
  "❤": `<i class="twa twa-heart">❤️</i>`
};
const res = [...raw].map(e => emojis[e] || e).join("");
document.write(res);

于 2019-05-30T13:58:37.863 回答