在反应本机中调用ref时，Undeifned不是函数

Question

我试图以反应原生方式调用参考输入，并且我不断获得undefined is not a function (evaluating 'this.textInput.focus()')

我真的不明白为什么，任何帮助将不胜感激

这是我的代码

＆＃13;

＆＃13;

import React, { Component } from 'react';
import styled from 'styled-components';
import PhoneInput from 'react-native-phone-input';

const Conatiner = styled.View`
  flex: 1;
`;

const MainText = styled.TextInput``;

export default class SignupScreen extends Component {
  static navigationOptions = {
    title: 'Signup',
  };

  constructor(props) {
    super(props);
    this.state = {
      f_name: '',
      l_name: '',
      country_code: '',
      phone: '',
    };

    this.focusLastName = this.focusLastName.bind(this);
  }

  focusLastName() {
    this.textInput.focus();
  }

  render() {
    return (
      <Conatiner>
        <MainText
          value={this.state.f_name}
          placeholder="First Name"
          returnKeyType="next"
          autoFocus
          onSubmitEditing={() => {
            this.focusLastName();
          }}
          onChangeText={(text) => {
            this.setState({ f_name: text });
          }}
        />

        <MainText
          value={this.state.l_name}
          placeholder="Last Name"
          ref={(input) => {
            this.textInput = input;
          }}
          onChangeText={(text) => {
            this.setState({ l_name: text });
          }}
        />

        <PhoneInput />
      </Conatiner>
    );
  }
}

＆＃13;

＆＃13;

＆＃13;