我使用的是React Native内置的Modal(特别是我使用的是React Native Paper变体)。默认情况下,这似乎在屏幕中间打开。但是,如果你要在Modal中进行一些文本输入,则在屏幕顶部打开或知道键盘的情况下,它会更加有用。但是,我找不到使它正常工作的方法。
我的(简化的)模态代码是:
<Portal>
<Modal visible={visibleModalNew} onDismiss={closeModalNew} contentContainerStyle={styles.modalContainer} >
<View>
<Title>New</Title>
<View>
<TextInput
mode="outlined"
label="Data"
style={{alignSelf:'center', width:'95%'}}
defaultValue={newData}
onChangeText={newData=> setNewData(newData)}
onSubmitEditing={() => handleDone()}
/>
<Button onPress={() => doSomething()}>Do something</Button>
</View>
</View>
</Modal>
</Portal>
啊,想通了。我将模态包装在KeyboardAwareView中,从模态中删除了可见的道具,然后将其全部包装在条件渲染中,然后将可见的道具放在那里。似乎按预期工作。