Question

现在我正在尝试使用react-emojify和react-markdown解析一些文字。我想以某种方式结合两个实用程序的功能。

问题是（如果我理解正确的话）将字符串转换为React DOM。当我在emojify上运行content时，结果无法传递到<ReactMarkdown source={result} />，反之亦然。

我正在考虑做某事，比如将React DOM序列化为HTML并在其他解析器中允许一些标签，但是在使它们兼容时两者都有相当有限的选项（例如emojify吐出表情符号作为跨度，这在ReactMarkdown中是不允许的）。

还有其他人试过吗？是否有某种方式（即使通过更改库）可以帮助我实现这一目标？

Answer 1

我设法通过将react-emojify替换为emojione来实现目标：

import emojione from 'emojione';
import React from 'react';
import ReactMarkdown from 'react-markdown';

class ExampleComponent extends React.Component {
  render() {
    const content = this.props.content;
    const emojified = emojione.shortnameToImage(content);
    return (
      <ReactMarkdown source={emojified} />
    );
  }
}

稍后我只需通过更改CSS中的.emojione类属性（而不是将选项对象传递到react-emojify函数）来调整如何显示表情符号。

如何在React中将emojione与markdown结合起来？

1 个答案: