Question

Ref 转发是一项将 ref 自动地通过组件传递到其一子组件的技巧。对于大多数应用中的组件来说，这通常不是必需的。但其对某些组件，尤其是可重用的组件库是很有用的。

forwardRef 会创建一个 Rax 组件，这个组件能够将其接受的 ref 属性转发到其组件树下的另一个组件中。

当我们在使用组件时，通常不需要引用内部的 DOM 元素的 ref，这很好，因为这防止组件过度依赖其他组件的 DOM 结构。

function Input(props) {
  return (
    <input />
  );
}

但某些场景比如，需要对 input 组件进行焦点管理或者 DOM 节点进行动画处理时，又必须要使用 DOM 操作。
Ref 转发是一个可选特性，其允许某些组件接收 ref，并将其向下传递给子组件。

import { forwardRef } from 'rax';
import View from 'rax-view';
import Text from 'rax-text';

const MyInput = forwardRef((props, ref) => (
  <input type="text" ref={ref}></input>
));

function App() {
  const ref = createRef();

  const focus = () => {
    ref.current.focus();
  };

  return <View>
    <MyInput ref={ref}></MyInput>
    <View onClick={focus}>Click</View>
  </View>
}