javascript - React 内联样式 - style prop 需要从样式属性到值的映射，而不是字符串

Question

我正在尝试在我的 React 应用程序中设置内联样式。在这种情况下，对于跨度:

<span className="myClass" style={{float : 'left', paddingRight : '5px'}} > </span>

React 告诉我:

Uncaught Invariant Violation: The style prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX. This DOM node was rendered by `SentenceView

我不太清楚这是什么意思。

PS:我尝试了不同的版本，所以我做了 paddingRight: 5 以及 paddingRight: 5 + 'px' 以及 paddingRight : 5px ，但我没有任何成功!

Answer 1

使用“styles” Prop 代替样式

<span className="myClass" style={{float : 'left', paddingRight : '5px'}} > </span>

这是来自 W3Schools 的一个很好的引用，它还向您展示了如何创建一个带有样式信息的对象，并在样式属性中引用它: reference for how to style React using CSS