javascript - 警告:未知的DOM属性类。 你的意思是className吗?

我刚刚开始探索React,通过添加一个具有简单渲染功能的组件:

render() {
  return <div class="myApp"></div>
}

当我运行应用程序时,我收到以下错误:

Warning: Unknown DOM property class. Did you mean className?

我可以通过将className更改为class来解决此问题。

问题是; React会执行这个约定吗? 另外为什么我需要使用className而不是传统的class? 如果这是一个限制,那么它是由于JSX语法还是其他地方?

jsalonen asked 2019-09-10T18:32:37Z
4个解决方案
112 votes

是的,它是一个React惯例:

由于JSX是JavaScript,因此标识符如classfor是   不鼓励为XML属性名称。 相反,React DOM组件   期望DOM属性名称分别为classNamehtmlFor

[https://facebook.github.io/react/docs/jsx-in-depth.html#html-tags-vs.-react-components]

Viacheslav answered 2019-09-10T18:33:06Z
13 votes

Meteor使用babel将ES5转换为ES6(ES2015),因此我们可以将其作为正常的Node应用程序处理,并添加了babel转换器。

您需要将npm文件添加到项目的根文件夹,并添加以下项目

{
  "plugins": [
    "react-html-attrs"
  ]
}

当然,您需要使用npm安装此插件:

npm install --save-dev babel-plugin-react-html-attrs

securecurve answered 2019-09-10T18:33:51Z
4 votes

您不能将class用于任何HTML标记属性,因为JS具有另一种类的含义。 这就是为什么你必须使用className而不是class。

并且还使用htmlFor属性而不是for。

Nimmi Verma answered 2019-09-10T18:34:22Z
3 votes

在React.js中没有for和class属性可用,所以我们需要使用

for   --> htmlFor
class --> className
KARTHIKEYAN.A answered 2019-09-10T18:34:47Z
translate from https://stackoverflow.com:/questions/30968113/warning-unknown-dom-property-class-did-you-mean-classname