我正在尝试创建一个受密码保护的屏幕.屏幕将使用4个数字输入作为密码.
我这样做的方法是创建一个TextInput组件,并在我的主屏幕中调用它4次.
我遇到的问题是当我键入前一个TextInput的值时,TextInputs不会关注下一个.
我正在为所有PasscodeTextInput组件使用refs(我已被告知这是一种遗留方法,但我不知道其他任何方式,唉).
试过这个方法(没有创建我自己的组件),也没有运气. 方法
index.ios.js
import React, { Component } from 'react';
import { AppRegistry, TextInput, View, Text } from 'react-native';
import { PasscodeTextInput } from './common';
export default class ProgressBar extends Component {
render() {
const { centerEverything, container, passcodeContainer, textInputStyle} = styles;
return (
<View style={[centerEverything, container]}>
<View style={[passcodeContainer]}>
<PasscodeTextInput
autoFocus={true}
ref="passcode1"
onSubmitEditing={(event) => { this.refs.passcode2.focus() }} />
<PasscodeTextInput
ref="passcode2"
onSubmitEditing={(event) => { this.refs.passcode3.focus() }} />
<PasscodeTextInput
ref="passcode3"
onSubmitEditing={(event) => { this.refs.passcode4.focus() }}/>
<PasscodeTextInput
ref="passcode4" /> …Run Code Online (Sandbox Code Playgroud)