22/11/23, 16:11 Alerta · Reagir nativo
Alerta
Inicia uma caixa de diálogo de alerta com o título e a mensagem especificados.
Opcionalmente, forneça uma lista de botões. Tocar em qualquer botão acionará o
respectivo retorno de chamada onPress e descartará o alerta. Por padrão, o único
botão será um botão 'OK'.
Esta é uma API que funciona tanto em Android quanto em iOS e pode mostrar alertas
estáticos. O alerta que solicita que o usuário insira algumas informações está
disponível apenas no iOS.
[Link] 1/7
22/11/23, 16:11 Alerta · Reagir nativo
Alert Example
import React from 'react';
import {View, StyleSheet, Button, Alert} from 'react- Download Expo Go and scan
native'; the QR code to get started.
const App = () => {
const createTwoButtonAlert = () =>
[Link]('Alert Title', 'My Alert Msg', [
{
text: 'Cancel',
onPress: () => [Link]('Cancel Pressed'),
style: 'cancel',
},
{text: 'OK', onPress: () => [Link]('OK
Pressed')},
]);
const createThreeButtonAlert = () =>
[Link]('Alert Title', 'My Alert Msg', [
{
text: 'Ask me later',
onPress: () => [Link]('Ask me later
pressed'),
},
{
text: 'Cancel',
onPress: () => [Link]('Cancel Pressed'),
style: 'cancel',
Connected devices 0
},
{text: 'OK', onPress: () => [Link]('OK
Pressed')},
Log in to open this Snack from Expo Go on
]); your device or simulator.
Preview My Device iOS Android
No iOS você pode especificar qualquer número de botões. Cada botão pode
opcionalmente especificar um estilo ou ser enfatizado. As opções disponíveis são
representadas pelo enum AlertButtonStyle e pelo isPreferred campo em AlertButton .
No Android, no máximo três botões podem ser especificados. O Android tem um
conceito de botão neutro, negativo e positivo:
Se você especificar um botão, ele será o 'positivo' (como 'OK')
[Link] 2/7
22/11/23, 16:11 Alerta · Reagir nativo
Dois botões significam 'negativo', 'positivo' (como 'Cancelar', 'OK')
Três botões significam 'neutro', 'negativo', 'positivo' (como 'Mais tarde', 'Cancelar',
'OK')
Os alertas no Android podem ser ignorados tocando fora da caixa de alerta. Ele está
desabilitado por padrão e pode ser habilitado fornecendo um parâmetro AlertOptions
opcional com a propriedade cancelable definida como true ie
{cancelable: true} .
O evento cancel pode ser tratado fornecendo uma onDismiss propriedade de retorno
de chamada dentro do options parâmetro.
Exemplo Android
Alert Android Dissmissable Example
import React from 'react';
import {View, StyleSheet, Button, Alert} from 'react- Download Expo Go and scan
native'; the QR code to get started.
const showAlert = () =>
[Link](
'Alert Title',
'My Alert Msg',
[
{
text: 'Cancel',
onPress: () => [Link]('Cancel Pressed'),
style: 'cancel',
},
],
{
cancelable: true,
onDismiss: () =>
[Link](
'This alert was dismissed by tapping outside
of the alert dialog.',
),
},
);
const App = () => (
<View style={[Link]}>
Connected devices 0
<Button title="Show alert" onPress={showAlert} />
</View>
Log in to open this Snack from Expo Go on
);
your device or simulator.
const styles = StyleSheet create({
Preview My Device Android
[Link] 3/7
22/11/23, 16:11 Alerta · Reagir nativo
Referência
alert()
static alert (
title: string,
message?: string,
buttons?: AlertButton[],
options?: AlertOptions,
);
Parâmetros:
NOME TIPO DESCRIÇÃO
título O título da caixa de diálogo. Uma string vazia null ou
corda
Obrigatório vazia ocultará o título.
Uma mensagem opcional que aparece abaixo do título
mensagem corda
da caixa de diálogo.
Botão Alerta
botões Uma matriz opcional contendo configuração de botões.
[]
Opções de
opções Uma configuração de alerta opcional.
alerta
prompt() iOS
static prompt: (
title: string,
message?: string,
callbackOrButtons?: ((text: string) => void) | AlertButton[],
type?: AlertType,
defaultValue?: string,
keyboardType?: string,
);
[Link] 4/7
22/11/23, 16:11 Alerta · Reagir nativo
Crie e exiba um prompt para inserir algum texto em forma de Alerta.
Parâmetros:
NOME TIPO DESCRIÇÃO
título Obrigatório corda O título da caixa de diálogo.
Uma mensagem opcional que aparece acima da
mensagem corda
entrada de texto.
Se for passada uma função, ela será chamada
com o valor do prompt
função
(text: string) => void , quando o usuário tocar
retorno de
em 'OK'.
chamadaOrButtons Botão Alerta
[]
Se for passado um array, os botões serão
configurados com base no conteúdo do array.
tipo AlertType Isso configura a entrada de texto.
valor padrão corda O texto padrão na entrada de texto.
O tipo de teclado do primeiro campo de texto (se
tipo de teclado corda
existir). Um dos TextInput keyboardTypes .
Opções de
opções Uma configuração de alerta opcional.
alerta
de tipo
AlertButtonStyle iOS
Um estilo de botão de alerta do iOS.
TIPO
enumeração
Constantes:
[Link] 5/7
22/11/23, 16:11 Alerta · Reagir nativo
VALOR DESCRIÇÃO
'default' Estilo de botão padrão.
'cancel' Estilo do botão Cancelar.
'destructive' Estilo de botão destrutivo.
AlertType iOS
Um tipo de alerta iOS.
TIPO
enumeração
Constantes:
VALOR DESCRIÇÃO
'default' Alerta padrão sem entradas
'plain-text' Alerta de entrada de texto simples
'secure-text' Alerta de entrada de texto seguro
'login-password' Alerta de login e senha
Um objeto que descreve a configuração de um botão no alerta.
TIPO
matriz de objetos
Propriedades dos objetos:
[Link] 6/7
22/11/23, 16:11 Alerta · Reagir nativo
NOME TIPO DESCRIÇÃO
texto corda Etiqueta do botão.
Função de retorno de chamada quando o botão é
onPress função
pressionado.
Estilo de botão, no Android esta propriedade será
estilo iOS AlertButtonStyle
ignorada.
é preferível Se o botão deve ser enfatizado, no Android esta
boleano
iOS propriedade será ignorada.
TIPO
objeto
Propriedades:
NOME TIPO DESCRIÇÃO
Define se o alerta pode ser descartado tocando fora da
cancelável Android boleano
caixa de alerta.
O estilo de interface usado para o alerta pode ser definido
userInterfaceStyle
corda como light ou dark , caso contrário, o estilo padrão do
iOS
sistema será usado.
Função de retorno de chamada disparada quando o alerta
onDismiss Android função
foi descartado.
Esta página é útil?
Edite essa página
Última atualização em4 de novembro de 2023
[Link] 7/7