#总结 减少ref的使用

[RocketV2]

项目中ref属性的作用

ref主要是用来获取dom对象，尤其是表单元素，如下代码：

<form onClick={this.eventHandler} onKeyDown={this.eventHandler} >
	<input type="text" ref={this.refDom} />
	<button type='submit'>add</button>
</form>

想获取input元素的值，显然不能使用jQuery的方式通过选择器来获取；而ref属性能够将dom对象作为形参传入函数中，此时函数this.refDom的形参就是input对象；

为何减少ref的使用

react采用虚拟DOM的目的是：减少DOM操作；但是ref属性操作的正是实际的DOM，这与react的理念相违背；

如何减少ref的使用

采用受控表单的方式；

<input type="text" value={this.state.getInputVal} onChange={this.getInputVal}  />