createRef和ref = {（c）=> this.el = c}有什么区别？
当我输出时，每个ref都具有相同的元素，但不是false。
为什么？
import React from "react"
class Home extends React.Component {
constructor(){
super();
this.el1 = React.createRef();
}
componentDidmount(){
console.log(el1 === el2) // false why false?
}
render(){
return (
<>
<div ref={this.el1}>
<span>A</span>
</div>
<div ref={(c)=> { this.el2 = c }}}>
<span>A</span>
</div>
</>
)
}
在代码中，两个ref都指向两个不同的DOM节点，这就是为什么它们不相同的原因。
createRef返回DOM节点或组件的已安装实例，具体取决于调用位置。无论哪种方式，您所拥有的确实确实很简单。但是，如果您想对该参考进行某些操作呢？如果要在安装组件时执行该怎么办？
Ref回调非常有用，因为它们在componentDidMount和componentDidUpdate之前被调用。这就是您如何对ref进行更细粒度的控制。现在，您不仅要强制性地获取DOM元素，还需要在React生命周期中动态更新DOM，而且可以通过ref API对DOM进行细粒度访问。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句