Question

我正在创建一个使用MaterialBottomTabBar的应用程序，并且在主屏幕中，我有一个应该打开<Modal>的按钮。

研究了一段时间后，我发现使用标签栏时无法显示模式。我试图将模式放在我的所有选项卡屏幕中（没有成功）。然后将模态移到选项卡栏中未包含的另一个屏幕上，模态运行良好。

export default function Home({ route, navigation }){
  const [modal, setModal] = useState(false)

  return(
    <View style={styles.container}>
          
      <Modal visible={modal} transparent={true}>
        <View style={{height: "100%", width: "80%", backgroundColor: "blue"}}>
          <Text>TIFMNASIFAMNFISAMFIAOFMSAOFMAFOPSAMF</Text>
        </View>
      </Modal>

      <TouchableOpacity style={styles.addNewButton} onPress={() => setModal(true)}>
        <Text style={styles.addNewButtonText}>+</Text>
      </TouchableOpacity>
    </View>
  )
}

如您所见，我正在使用React Native Hooks useState(false)，并在Modal中引用它。但是，每当我点击<TouchableOpacity>时，模态都不会显示。

注意！如果我替换

，则会显示模态

<Modal visible={modal} transparent={true}>

到

<Modal visible={true} transparent={true}>

但是会立即运行，在我的情况下这不是一个选择。您知道如何在屏幕上运行此模式吗？

在屏幕中呈现模态

0 个答案: