react Refs使用 & DOM 非受控组件

使用 React.createRef() 创建 refs

通过 ref 属性来获得 React 元素。当构造组件时，refs 通常被赋值给实例的一个属性，这样你可以在组件中任意一处使用它们.
当一个 ref 属性被传递给一个 render 函数中的元素时，可以使用 ref 中的 current 属性对节点的引用进行访问。
ref的值取决于节点的类型:

• 当 ref 属性被用于一个普通的 HTML 元素时，React.createRef() 将接收底层 DOM 元素作为它的 current属性以创建 ref 。
• 当 ref 属性被用于一个自定义类组件时，ref 对象将接收该组件已挂载的实例作为它的 current 。
• 不能在函数式组件上使用 ref 属性，因为它们没有实例。可以在函数式组件内部使用 ref，只要它指向一个 DOM 元素或者 class 组件：
  React 会在组件加载时将 DOM 元素传入 current 属性，在卸载时则会改回 null。ref 的更新会发生在componentDidMount 或 componentDidUpdate 生命周期钩子之前。
  可以使用 ref 来访问自定义输入，手动调用它的方法来模拟挂载之后立即被执行。

输入表单元素，它的值由React控制的称为受控组件。当用户将数据输入到受控组件中时，会触发一个改变事件处理器，使用更新的值重新渲染。如果不重新渲染，那么表单元素将保持不变。
不受控的表单类似于传统的html表单输入，为 DOM 元素添加 Ref
，可以使用ref获取其值：
<input type=“text” ref={input => this._name = input} />
const name = this._name.value;//name为表单的值
表单在UI反馈方面简单，可以使用不受控表单。