React Native TextInput输入时键盘自动关闭问题排查求助

核心问题 #

你的代码中第一个TextInput的onSubmitEditing属性写法错误：

onSubmitEditing={inputLastNameRef.current?.focus()}

这种写法会在组件每次渲染（包括state更新触发的重渲染）时立即执行focus()，而不是仅在点击键盘提交按钮时执行。当你输入内容触发onChangeText更新userInfo state时，组件重新渲染，这段代码会被执行，但此时inputLastNameRef.current可能尚未正确绑定到第二个输入框，导致焦点异常丢失，键盘随之关闭。

修复步骤 #

将onSubmitEditing改为传递一个回调函数，确保只有在提交编辑时才调用焦点切换逻辑：

<TextInput
    ref={inputNameRef}
    placeholder={'Your Name'}
    onChangeText={(text) => {
        setUserInfo((prevState) => ({...prevState, name: text}));
    }}
    value={userInfo.name}
    onSubmitEditing={() => inputLastNameRef.current?.focus()}
/>

额外验证点 #

• 确认ScrollView的keyboardShouldPersistTaps={'handled'}设置正确，这个属性可以保证点击输入框外的可交互元素时键盘不关闭，当前配置没问题。
• 确保两个TextInput的ref绑定正确，当前代码的useRef声明和赋值逻辑是正确的。

内容的提问来源于stack exchange，提问作者Tugberk Ulucan