回调 Refs

React 也支持另一种设置 refs 的方式，不同于传递 React.createRef() 创建的Refs，我们可以给ref属性传递一个函数。在这个函数中通过参数来获取 React 组件实例或 HTML DOM 元素。

使用回调Refs

xxxxxxxxxx
componentDidMount() {
      this.inputDom.focus()
      this.refcom.onLog()
}   
setInputRef = (ele) => {
     console.log(ele)
     this.inputDom=ele
}
setClassRef = (refcom) => {
      console.log(refcom)
     this.refcom=refcom
        
}
render() {
     return (
          <>
              <input ref={this.setInputRef} />
              <RefCom ref={this.setClassRef} />  
          </>
      )
}

提示：

React 将在组件挂载时，会调用 ref 回调函数并传入 DOM 元素，当卸载时调用它并传入 null。在 componentDidMount 或 componentDidUpdate 触发前，React 会保证 refs 一定是最新的。

实时效果反馈

1. 下列说法正确的是：

A 给类组件设置ref并传递一个函数，则可以通过访问ref的current属性获取实例

B 给DOM设置ref并传递一个函数，则可以通过访问ref的current属性获取原生DOM

C 给DOM设置ref并传递React.createRef()的返回值，则可以通过访问函数参数获取原生DOM

D 给类组件设置ref并传递一个函数，则可以通过访问函数的参数获取实例

答案

1=>D