当前位置: 首页 > 面试题库 >

反应内联样式-样式道具需要从样式属性到值而不是字符串的映射

呼延曜灿
2023-03-14
问题内容

我试图在我的React应用程序中设置内联样式。在这种情况下,跨度为:

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

React告诉我:

未捕获的不变违反:该style道具期望从样式属性到值而不是字符串的映射。例如,使用JSX时,样式=
{{marginRight:空格+’em’}}。该DOM节点由`SentenceView渲染

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

PS:我曾尝试不同的版本,所以我也paddingRight: 5还有paddingRight: 5 + 'px'还有paddingRight : 5px,但我没有任何成功!


问题答案:

使用“ 风格 小号 ”道具的风格,而不是

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


 类似资料:
  • 问题内容: 是否有CSS选择器通过其内联样式属性值选择此元素? 就像是 问题答案: 内联属性与任何其他HTML属性没有什么不同,并且可以与子字符串属性选择器匹配: 正是由于这个原因,它 非常脆弱 。由于属性选择器不支持正则表达式,因此只能执行与属性值 完全 匹配的子字符串。例如,如果属性值中的某处有空格,如下所示: 在您更改选择器以适应空间之前,它不会匹配。然后,它将停止匹配 不 包含空格的值,除

  • vue2中有些css为何写在less不起作用,非得写在标签上才起作用 起作用 不起作用

  • 问题内容: 是否有可能使用内联样式的伪类? 例: 我知道上述HTML不能正常运行,但是有类似的东西吗? 附言:我知道我应该使用外部样式表,并且可以。我只是好奇是否可以使用内联样式来完成。 问题答案: 不,这是不可能的。在使用CSS的文档中,内联属性只能包含属性声明。样式表中每个规则集中出现的同一组语句。根据样式属性规范: style属性的值必须匹配CSS 声明块(不包括定括号)的内容的语法,其声明

  • 问题内容: 请执行以下操作: 与以下内容相比对性能有任何影响: 问题答案: 从文档的 性能: 用样式对象制作样式表可以通过ID引用它,而不必每次都创建一个新的样式对象。 它还仅允许通过桥发送一次样式。所有后续使用都将引用一个ID(尚未实现)。 另一个好处是样式错误将在编译时而不是运行时生成。 我个人仍然喜欢使用内联样式(并为共享样式创建新的组件),因为它使代码对我而言更具可读性,并且对性能的影响并

  • 我在React web上使用样式化组件已经有一段时间了,但最近我开始开发一个React Native应用程序,我决定在中使用样式化的组件。当设计只有属性的组件时,比如默认的components,这是非常好的。 但是,我遇到的问题是,当我需要为具有多个样式属性的更复杂的组件设置样式时,例如、等。 当只有一个样式属性具有不同的名称时,我可以执行以下操作: 这完美无缺,但是当组件具有多种样式时,我不知道