react.js获取真实dom节点

findDOMNode

 ReactDOM.findDOMNode(component)

• 注意事项：
• 只在已挂载的组件上可用（即，已经放置在DOM中的组件）
• findDOMNode不能用于函数组件

Refs

允许我们访问DOM节点或在render方法中创建的React元素。

• 创建refs

constructor(props){
    super(props)
    this.usernameRef=React.createRef()
}

• 使用

<button ref={this.testRef}></button>

• 访问

handleSubmit(){
    console.log(this.usernameRef.current.value)
}

ref的值根据节点的类型而有所不同：

• 当ref属性用于HTML元素时，构造函数中使用React.createRef()创建的ref接收底层DOM元素作为其current属性。
• 当ref属性用于自定义class组件时，ref对象接收组件的挂载实例作为其current属性。
• 你不能在函数组件上使用ref属性，因为他们没有实例。