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

我正在尝试将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>;

案例“段落”：
返回{data.text}；

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

这是一个react应用程序，因此正在寻找javascript解决方案。也不想使用危险的LysetinenerHTML

是回答这个问题的好资源

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

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

函数createMarkup（）{
返回{uuuhtml:'First·；Second'}；
}
函数MyComponent（）{
返回；
}

``关键是您希望保留样式，对吗？如果你把它们脱掉很容易。我已经使用

DOMParser

将字符串解析到DOM节点中，我可以使用普通的JS方法将它们附加到DOM树中，但这感觉不对。必须有一种更具反应性的方式…就在您复制的代码上方，react文档中说，使用这种方式是有风险的-从代码中设置HTML是有风险的，因为很容易无意中让您的用户受到跨站点脚本（XSS）攻击。您可以直接从React设置HTML，但您必须键入危险的HTML，并使用_uHTML键传递对象，以提醒自己这是危险的。尽管如此，还是要感谢您的回答。投票，但不接受答案。