如何将子节点的 ref 暴露给父组件
16.3 以上的 Refs 转发，使用 React.forwardRef((props, ref) => {return React 元素})将 ref 自动地通过组件传递给子组件
点击查看【codepen】

  1. 创建 ref 对象
  2. 给组件赋值 ref
  3. 通过 forwadRef 向 input 转发 ref 属性
  4. myInputRef.current 指向 input DOM 节点

  5. ref 参数只能用 forwardRef 定义的组件内可接收

    在高阶函数中的使用

    点击查看【codepen】

    转发的各种方法

    16.2 及以下的 Refs转发，没有 forwardRef，使用就 props 与 createRef 来配合
    点击查看【codepen】
    回调 Refs
    借助 ref 属性为回调函数时其参数 el 就是指向 ref 引用
    点击查看【codepen】
    废除的 string Refs

    1. class App extends React.Component {
    2. constructor(props) {
    3.  super(props);
    4.  this.myInput = null;
    5. }
    7. componentDidMount() {
    8.  console.log(this.refs.inputRef);
    9. }
    11. render() {
    12.  return (
    13.    <div>
    14.      <MyInput ref="inputRef" />
    15.    </div>
    16.  );
    17. }
    18. }

  6. string Refs 依赖组件实例下面的 refs 集合里的 ref
    需要 React 保持追踪当前正在渲染的组件，如果没有加载完成 this 是没法确定
    React 获取 ref 可能会比较慢

  7. 不能在 render 中工作
  8. 不能组合，只能有一个 ref