react哪些写法与原生不同

如果不了解这些，就等着掉坑吧！！！

单选按钮默认属性

在原生html中，直接用checked就可以。而在react中则是defaultChecked。

原生：
<input type="radio" name="sex" value="man" checked />

react：
<input type="radio" name="sex" value="man" onChange={this.changeHandle} defaultChecked />

下拉框默认属性

原生中是给option标签添加selected属性，将其设置成默认。但是在react中是给select标签设置defaultValue属性来实现。

原生：
<select name="diqu">
  <option value="河北">河北</option>
  <option value="河南" selected>河南</option>
  <option value="山西">山西</option>
</select>

react：
<select name="diqu" defaultValue={this.state.diqu} onChange={this.changeHandle}>
  <option value="河北">河北</option>
  <option value="河南">河南</option>
  <option value="山西">山西</option>
</select>

onChange事件

在react的onChange事件中和原生的input事件的触发条件是一样的。当表单字段更改就会触发。（原生onChange是失去焦点）

inputChange(e){
    console.log(e.target.value); //获取输入的值
}

<Input type="text" placeholder="请输入姓名" onChange={this.inputChange} />

for属性

在react中将for属性换成了htmlFor，比如label标签的for属性，应该这样写。

<label htmlFor=""></label>