React htmlfor

注意，在添加属性时， class 属性需要写成 className ，for 属性需要写成 htmlFor ，这是因为 class 和 for 是 JavaScript 的保留字。
在React中，当我们需要为一个表单元素设置标签时，可以使用htmlFor属性。它与HTML中的for属性相似，但因为for是JavaScript的关键字，所以React使用htmlFor代替。htmlFor的作用是将标签与相应的表单元素关联起来，从而使浏览器知道该标签与哪个输入框匹配。在单页应用程序中，使用htmlFor属性可以让我们获得更好的可维护性和可读性。

用法

import React from 'react';
import ReactDOM from 'react-dom';
let names = ['张三','李四','王五'];


ReactDOM.render(
  <form>
    <label htmlfor="username">用户名</label>
    <input id="username"></input>
  </form>,document.getElementById('root')
);

上述代码中，label元素与input元素实现关联唯一的方式是把label的for属性的值设置为input的id属性的值。但是在React中，为了避免使用for关键字，需要使用htmlFor属性替代原先的for。