在React(Facebook的框架)中,我需要使用standard for
属性渲染绑定到文本输入的label元素。
例如,使用以下JSX:
<label for="test">Test</label>
<input type="text" id="test" />
但是,这将导致HTML缺少必需的(和标准的)for
属性:
<label>Test</label>
<input type="text" id="test">
我究竟做错了什么?
在React(Facebook的框架)中,我需要使用standard for
属性渲染绑定到文本输入的label元素。
例如,使用以下JSX:
<label for="test">Test</label>
<input type="text" id="test" />
但是,这将导致HTML缺少必需的(和标准的)for
属性:
<label>Test</label>
<input type="text" id="test">
我究竟做错了什么?
Answers:
for
调用该属性是htmlFor
为了与DOM属性API保持一致。如果您使用的是React的开发版本,则应该在控制台中看到关于此的警告。
label
元素(如返回document.createElement
,document.getElementById
等),你访问它的for
财产label.htmlFor
。
是的,要做出反应,
for
变成 htmlFor
class
变成 className
等等
在此处查看有关如何更改HTML属性的完整列表:
对于React,您必须使用它的每个定义关键字来定义html属性。
class
->className
用于和
for
->htmlFor
使用,因为反应区分大小写,请确保您必须遵循小写和大写的要求。
双方for
并class
在JavaScript中的保留字,这就是为什么当它涉及到HTML中JSX属性,你需要使用别的东西,做出反应的团队决定使用htmlFor
和className
分别
for
JavaScript中是保留字,因此应使用React元素htmlFor
。”:reactjs.org/docs/dom-elements.html#htmlfor
htmlFor
来代替for
!您可以通过以下链接找到更多信息。
https://facebook.github.io/react/docs/dom-elements.html#html用于
那是JSX中的htmlFor,而类是JSX中的className