React 移除内联样式答案

【问题标题】：React Removes Inline StylesReact 移除内联样式
【发布时间】：2018-12-22 03:31:40
【问题描述】：

我正在使用 React 编写 HTML 电子邮件。与任何优秀的 HTML 电子邮件一样，我使用的内联样式针对的是 Microsoft Outlook 等旧版客户端。 React 在渲染过程中删除了一些样式。如何添加对这些样式的支持或解决此问题？样式必须内联。

这是一个例子：

function MyComponent() {
  const style = {
    fontFamily: 'Arial, Helvetica, sans-serif',
    msoHide: 'all'
  }

  return(
    <div style={style}>
      Some text goes here...
    </div>
  )
}

渲染时，mso-hide: all 样式被移除：

<div style="font-family: Arial, Helvetica, sans-serif;">
  Some text goes here...
</div>

【问题讨论】：

如果通过类应用会发生什么？
@Dadsquatch 样式需要内联。否则上课就好了。
有没有可能不是 React，而是浏览器去掉了这个？
@putvande 好问题。使用 JavaScript 设置不受支持的样式时可能会出现这种情况。老实说，我不确定。但是，我仍然需要一种解决方法来使用 React 内联所有必要的样式。就像我可以简单地使用纯 HTML 编写 <div style="unsupported-property-name: all;"> 一样，浏览器不会将其从 DOM 中剥离。

标签： javascript reactjs inline-styles

【解决方案1】：

文档说样式对象中特定于供应商的属性必须以大写字母开头，例如WebkitAppearance 而不是 webkitAppearance。他们还说ms 是该规则的一个例外。 See here.

不过，这是mso。 MsoHide 有效吗？

【讨论】：

我看到了这个并尝试了一些变体，比如MsoHide。不幸的是，这不起作用。