<Modal />
O componente Modal ele apresenta um conteúdo de maneira básica por cima da View principal, é uma maneira prática de exibir dados apresentando somente quando for necessário, sem precisar redimensionar o usuário para outra View.
import React, {useState} from 'react'
import { View, Text, Modal,Button } from 'react-native'
import { useState } from 'react'
export default function Modal() {
const [modalVisible, setModalVisible] = useState(false)
function OpenModal(){
setModalVisible(true)
}
function FecharModal(){
setModalVisible(false)
}
return (
<View>
{/* Quando clicar no button chama minha funcção que passei no onPress */}
<Button title="Acessar Modal" onPress={OpenModal} />
<Modal transparent={false} animationType="slide" visible={modalVisible} >
<Detalhes close={FecharModal} />
</Modal>
</View>
)
}
// por meio de props vou passar o close que recebe a função de fechar o modal
export default function Detalhes(props){
return(
<View>
<Text> Seja bem vindo </Text>
<Button title="Fechar Modal" onPress={ props.close } />
</View>
)
}