为什么 <TextInput> 在 React Native 中的绝对定位父容器 <View> 中无法聚焦？

Question

我有一个

TextInput

组件，它位于

View

内，样式设置为

position: "absolute"

:

const [searchTerm, setSearchTerm] = useState('Test');
return (
   <View style={{position: "absolute"}}>
      <TextInput
         autoFocus={true}
         value={searchTerm}
         onChangeText={text => setSearchTerm(text)}
      />
   </View>
)

设置此样式后，即使我可以看到输入字段和默认文本（

TextInput

），我也无法聚焦或与

autoFocus={true}

（包括

Test

）进行任何交互。一旦我删除了绝对定位，我就可以像往常一样使用

TextInput

。

这种行为的原因是什么？ （使用安卓）

Answer 1

你应该添加

zIndex:400

或一些对我有用的高数字

Answer 2

这里解释了这个问题的根本原因：长按选择和按下移动光标在位置上不起作用：'absolute'TextInput outside parent bounds on Android

解决方案是您可能需要更改

position: 'absolute'

视图的父级，以便其边界包含位置绝对视图。该父视图不在您的代码示例中，因此父视图在另一个组件中。