react使用ref控制DOM元素（非受控组件）

总有一些场景我们需要直接操作dom元素，react有类似vue的refs的写法。

import React, { Component, Fragment } from "react";

class Input extends Component {
  constructor(props) {
    super(props);
    // *现在的写法 2020-6 
    this.helloDiv= React.createRef();
  }
  componentDidMount() {
    // 操作refs
    let a = this.helloDiv.current;
    console.log(a); //<div>hellow</div>
    a.style.color = "red"; //直接操作dom对象，和VUE的refs一样
  }
  
  render() {
    return (
      <Fragment>
        {/* 1.管理焦点  2.触发强制动画   3.集成第三方dom库 */}
        <div ref={this.helloDiv}>hellow</div>
      </Fragment>
    );
  }
}

export default Input;