语法错误：在反应中使用内联样式时，标识符直接位于数字之后

Posted 2023-02-21

【中文标题】语法错误：在反应中使用内联样式时，标识符直接位于数字之后

【英文标题】：Syntax error: Identifier directly after number when using inline style in react

【发布时间】：2018-05-09 22:45:57

【问题描述】：

在 react js 中使用内联样式时遇到一些错误，我不知道是什么意思

例如，我认为在内联样式中使用括号会起作用，

【问题讨论】：

去掉Transition前的分号，使所有值成为字符串

React.js inline style best practices的可能重复

【参考方案1】：

React 样式属性需要一个有效的带有驼峰式属性名称的 javascript 对象。键值对中的值可以是数字或字符串（或表示这两项之一的变量）。见React Docs for more information。

样式对象看起来像：

const style =  
      transform: "translate3d(0px, 0px, 0px)", 
      transition: "0s"
    

注意没有分号，值是字符串，每个css属性/值用逗号分隔。

注意：你可以为基于像素的值传递数字，React 会为你添加“px”。但是在上面的 0px 情况下，它不起作用，因为它是字符串的一部分，而不仅仅是一个简单的数字。

尝试：

style= transform: "translate3d(0px, 0px, 0px)", transition: "0s"

或者，使用我在上面创建的变量：

style=style

【讨论】：

非常感谢先生，