React Native 中 ref 属性不只是 string

Question

ref 属性不仅接受 string 类型的参数，而且它还接受一个 function 作为 callback。这一特性让开发者对 ref 的使用更加灵活。

 render: function() {
    return (
      <TextInput
        ref={function(input) {
          if (input != null) {
            input.focus();
          }
        }} />
    );
  },

在 ES6 中我们可以使用箭头函数来为组件的 ref 设置一个 callback。

  render() {
    return <TextInput ref={(c) => this._input = c} />;
  },
  componentDidMount() {
    this._input.focus();
  },

需要提醒大家的是，只有在组件的 render 方法被调用时，ref 才会被调用，组件才会返回 ref。如果你在调用 this.refs.xx 时 render 方法还没被调用，那么你得到的是 undefined。

心得：ref 属性在开发中使用频率很高，使用它你可以获取到任何你想要获取的组件的对象，有个这个对象你就可以灵活地做很多事情，比如：读写对象的变量，甚至调用对象的函数。