ReactJs学习——ref

class中定义方法

<input type="text" ref={(input) => { this.textInput = input; }} />

使用方法 this.textInput.focus()

function中定义方法，外部获取也采用这种方式

<input type="text" ref={(input) => { textInput = input; }} />

使用方法 textInput.focus()

暴露ref给父级组件

this.inputElement 指向的是 CustomTextInput 中的 input

function CustomTextInput(props) {
  return (
    <div>
      <input ref={props.inputRef} />
    </div>
  );
}

class Parent extends React.Component {
  render() {
    return (
      <CustomTextInput
        inputRef={el => this.inputElement = el}
      />
    );
  }
}

用变量定义ref

<Text ref={(text) => this['text-'+index] = text}>ref variable</Text>
使用 
this['text'+index]或
this[`text${index}`]