Question

我有一个Textinput，我想在光标未填充时进行设置。

class SignupScreen extends Component {
  constructor(props) {
    super(props);
    this.fieldOne = React.createRef(); 
    this.state = {
        name: '',
    }
}

validate() {
   if(_.size(this.state.name) < 3) {
      ...
      this.fieldOne.current.focus() // this is not working
    }
}

render() {
return(
.... 
<TextInput
    placeholder={'Name'}
    autoCapitalize='words'
    autoCorrect={false}
    autoFocus={false}
    keyboardType='default'
    value={this.state.name}
    ref={this.fieldOne}
    selectionColor={colors.PRIMARY_LIGHT}
    placeholderTextColor={colors.PRIMARY_LIGHT}
    underlineColorAndroid={colors.NO_COLOR}
    onChangeText={(text) => this.setState({ name: text })}
/>
 ...
}

在validade方法中，当光标不合适时，我想将光标聚焦在该字段内。我查看了互联网，并在https://github.com/facebook/react-native/issues/20817上将此问题发布为问题。虽然，我还没有找到真正的解决方案。

谢谢你！

Answer 1

您需要bind validate函数，或使用箭头函数。

您可以将以下内容添加到constructor的底部

this.validate = this.validate.bind(this);

或者，将功能更改为箭头功能

validate = () => {
  // Function body
}

这里是example，单击按钮将重点放在TextInput。

Answer 2

谢谢@Dan！感谢您的回答，尤其是示例！但是，它对我没有用。无论如何，我已经安装了react-native元素，并且一直在使用这些东西。

TextInput上的React.createRef（）在React Native 16.3.1中无法正常工作

2 个答案: