AlertIOS

参考文档

AlertIOS用于弹出一个 iOS 提示对话框，可以通知用户一些信息或是提示用户输入一些文字。

弹出一个 iOS 提示框：

AlertIOS.alert(
 'Sync Complete',
 'All your data are belong to us.'
);

弹出一个带输入框的 iOS 提示框：

AlertIOS.prompt(
  'Enter a value',
  null,
  text => console.log("You entered "+text)
);

其他情况下，尤其是仅仅显示一个静态的提示框时，应该使用跨平台的Alert。

方法

alert()

static alert(title: string, [message]: string, [callbackOrButtons]: ?(() => void), ButtonsArray, [type]: AlertType): [object Object]

创建并显示一个提示框。

参数：

名称	类型	必填	说明
title	string	是	对话框的标题。传递null或''将隐藏标题。
message	string	否	对话框标题下方显示的可选消息。
callbackOrButtons	?(() => void),ButtonsArray	否	此可选参数应该是单参数函数或按钮数组。如果传递了一个函数，则当用户点击“确定”时将调用该函数。如果传递了一系列按钮配置，则每个按钮应包括一个文本键，以及可选的onPress和style键。样式应为“默认”，“取消”或“破坏性”之一。
type	AlertType	否	不推荐使用，请勿使用。

案例：

AlertIOS.alert(
  "Update available",
  "Keep your app up to date to enjoy the latest features",
  [
    {
      text: "Cancel",
      onPress: () => console.log("Cancel Pressed"),
      style: "cancel"
    },
    {
      text: "Install",
      onPress: () => console.log("Install Pressed")
    }
  ]
);

prompt()

static prompt(title: string, [message]: string, [callbackOrButtons]: ?((text: string) => void), ButtonsArray, [type]: AlertType, [defaultValue]: string, [keyboardType]: string): [object Object]

创建并显示提示输入一些文本。参数：

名称	类型	必填	说明
title	string	是	对话框的标题。
message	string	否	在文本输入上方显示的可选消息。。
callbackOrButtons	?((text: string) => void),ButtonsArray	否	此可选参数应该是单参数函数或按钮数组。如果传递了函数，则在用户点击“确定”时将使用提示的值来调用它。如果传递了一组按钮配置，则每个按钮应包括一个文本键，以及可选的onPress和style键（请参见示例）。样式应为“默认”，“取消”或“破坏性”之一。
type	AlertType	否	这将配置文本输入。 “纯文本”，“安全文本”或“登录密码”之一。
defaultValue	string	否	文本输入中的默认文本。
keyboardType	string	否	第一个文本字段的键盘类型（如果存在）。 “默认”，“电子邮件地址”，“数字”，“电话键盘”，“具有ascii功能”，“数字和标点符号”，“ url”，“数字键盘”，“姓名电话”之一 -pad”，“ decimal-pad”，“ twitter”或“ web-search”。。

带有自定义按钮的示例：

AlertIOS.prompt(
  "Enter password",
  "Enter your password to claim your $1.5B in lottery winnings",
  [
    {
      text: "Cancel",
      onPress: () => console.log("Cancel Pressed"),
      style: "cancel"
    },
    {
      text: "OK",
      onPress: password => console.log("OK Pressed, password: " + password)
    }
  ],
  "secure-text"
);

具有默认按钮和自定义回调的示例：

AlertIOS.prompt(
  "Update username",
  null,
  text => console.log("Your username is " + text),
  null,
  "default"
);

类型定义

AlertType

警报按钮类型 : $Enum

常量

值	说明
default	没有输入的默认警报
plain-text	纯文本输入警报
secure-text	安全文本输入警报
login-password	登录名和密码提醒

AlertButtonStyle

警报按钮样式 : $Enum

常量

值	说明
default	默认按钮样式
cancel	取消按钮样式
destructive	破坏性按钮样式

ButtonsArray

数组或按钮 : Array

属性

名称	类型	说明
[text]	string	按钮标签
[onPress]	function	按下按钮时的回调功能
[style]	AlertButtonStyle	按钮样式

常量

值	说明
text	按钮标签
onPress	按下按钮时的回调功能
style	按钮样式

Example

示例

import React, { Component } from 'react';
import {View,AlertIOS,StyleSheet,Button } from 'react-native';
export class pageComponent extends Component {
    constructor(props){
        super(props);
        this.state={
            value: 10
        }
    }
    componentDidMount() {

    }
    alert=()=>{
        AlertIOS.alert(
            '标题',
            '内容'
        );
    }
    prompt=()=>{
        AlertIOS.prompt(
            "请输入密码",
            "请输入你的密码支付20元",
            [
                {
                    text: "取消",
                    onPress: () => console.log("取消支付"),
                    style: "cancel"
                },
                {
                    text: "确认",
                    onPress: password => console.log("确认支付: " + password)
                }
            ],
            "secure-text"
        );
    }
    prompt2=()=>{
        AlertIOS.prompt(
            "更新昵称",
            null,
            text => console.log("你的昵称是 " + text),
            null,
            "default"
        );
    }

    render(){
        return(
            <View style={styles.container}>
                <Button
                    style={styles.text}
                    onPress = {
                        this.alert
                    }
                    title = {'弹出一个 iOS 提示框'}
                />
                <Button
                    style={styles.text}
                    onPress = {
                        this.prompt
                    }
                    title = {'弹出一个带输入框的 iOS 提示框'}
                />

                <Button
                    style={styles.text}
                    onPress = {
                        this.prompt2
                    }
                    title = {'具有默认按钮和自定义回调'}
                />

            </View>
        )
    }
}
const styles = StyleSheet.create({
    container: {
        marginTop: 100,
        padding: 10,
        borderRadius: 5,
        alignItems: 'center',
        width: 300
    },
    text: {
        marginTop: 20,
        fontSize:20,
    }
});

3.3.2 AlertIOS