如何将内联文本样式的JSON转换为html文本样式？

Question

我正在尝试将JSON从editorjs转换为html。

 {
         "type":"paragraph",
         "data":{
            "text":"This is a test of various inline styles - <b>bold</b> <i><b>bold italic </b>and just italic</i>"
         }
      },
      {
         "type":"paragraph",
         "data":{
            "text":"<b>bold</b>"
         }
      },
      {
         "type":"paragraph",
         "data":{
            "text":"<b><i>bold Italic</i></b>"
         }
      },

上面有来自editorjs的json示例。

现在，我将整个段落渲染一遍。

case "paragraph":
  return <Typography variant="subtitle1">{data.text}</Typography>;

如果我编写一个函数，它应该逐个字符地求值吗？

这是针对React应用的，因此正在寻找javascript解决方案。也不想危险地使用SetInnerHTML

Answer 1

https://reactjs.org/docs/dom-elements.html是此答案的好资源。

function createMarkup() {
  return {__html: 'First · Second'};
}

function MyComponent() {
  return <div dangerouslySetInnerHTML={createMarkup()} />;
}