如何在 React 中使用危险的SetInnerHTML 传递样式

Question

我在我的 react 组件中使用危险的 SetInnerHTML 以如下格式注入 html：

<div 
    className="mt-2 col variant-attr-cell p-0" 
    dangerouslySetInnerHTML = { { 
        __html: JSON.parse(attrs[i].snippet).snippet.replace("{text}", 
        attrs[i].choices[j].visualization_data) 
    } } 
>
</div>

它工作正常，但我试图同时将样式传递给注入的 html 但不知道如何！我正在尝试根据我获得的 api 向注入的 html 添加不同的样式，如下所示：

height: 12px;
width: 12px;
border-radius: 50%;
display: inline-block;
margin: 0 4px;

仅供参考，注入的 html 主要是这样的：

<span></span>

并且样式必须添加到这个而不是容器div！任何解决方案表示赞赏，谢谢。

Answer 1

由于我从 API 获取 HTML，因此我使用数据库中的静态值设置 HTML 的样式属性，并在组件中替换来自 API 的静态值！