React Native中Android端TextInput设autoFocus=true键盘不弹出如何解决

问题根因 #

React Native 0.64.2版本存在Android端已知兼容性问题：TextInput的autoFocus属性会因页面渲染和窗口焦点获取的时序差，在多数安卓机型上无法正常触发键盘弹出。

可用方案 #

方案1：手动触发TextInput聚焦（推荐，全版本适配） #

通过ref获取TextInput实例，在页面挂载完成后加短延时调用focus方法，规避时序问题：

import React, { useRef, useEffect } from 'react';
import { TextInput, View } from 'react-native';

const DemoScreen = () => {
  // 声明TextInput的ref
  const inputRef = useRef<TextInput>(null);

  useEffect(() => {
    // 延时100ms触发，等待安卓端窗口获取焦点完成
    const focusTimer = setTimeout(() => {
      inputRef.current?.focus();
    }, 100);

    // 页面卸载时清除定时器
    return () => clearTimeout(focusTimer);
  }, []);

  return (
    <View>
      {/* 移除autoFocus属性，通过ref手动控制 */}
      <TextInput
        ref={inputRef}
        placeholder="请输入内容"
        // 其他TextInput属性
      />
    </View>
  );
};

export default DemoScreen;

如果TextInput嵌套在Modal、弹窗等异步展示的容器内，可将延时调整为200~300ms，等待容器完全渲染后再触发聚焦。

类组件可在componentDidMount生命周期中执行相同的延时聚焦逻辑。

方案2：配合原生配置兜底 #

如果部分低版本安卓机型方案1仍不生效，可修改安卓项目android/app/src/main/AndroidManifest.xml中对应页面的Activity配置：

<activity
  android:name=".MainActivity"
  <!-- 新增/修改这一行配置 -->
  android:windowSoftInputMode="stateVisible|adjustResize"
  <!-- 其他原有配置 -->
>
</activity>

stateVisible配置会告知安卓系统在当前Activity启动时自动弹出软键盘，配合方案1的手动聚焦可覆盖99%以上的场景。

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