进阶 reactnative.dev 2026-10-11 06:04:21 · 36 阅读
第4章 React Native 第4章：Alert 警报组件详解
版本：0.77Alert
Alert 用于弹出带有指定标题和内容的警告框。
可以传入一组按钮。点击任意按钮会触发对应的 onPress 回调并关闭警告框。默认只有一个 'OK' 按钮。
这是一个同时支持 Android 和 iOS 的 API，可以显示静态警告框。带输入框、让用户填写信息的警告框仅 iOS 支持。
示例
iOS
在 iOS 上可以指定任意数量的按钮。每个按钮可以选择指定样式或标记为强调样式，可选值由 AlertButtonStyle 枚举和 AlertButton 上的 isPreferred 字段表示。
Android
在 Android 上最多只能指定三个按钮。Android 有中性（neutral）、否定（negative）和肯定（positive）三种按钮的概念：
指定一个按钮时，它是 'positive'（如 'OK'）
两个按钮依次是 'negative'、'positive'（如 'Cancel'、'OK'）
三个按钮依次是 'neutral'、'negative'、'positive'（如 'Later'、'Cancel'、'OK'）
在 Android 上，点击警告框外部可以关闭警告框。该行为默认关闭，可通过传入可选的 AlertOptions 参数并将 cancelable 属性设为 true 来开启，即
{cancelable: true}。 可以通过在 options 参数中传入 onDismiss 回调来处理取消事件。 Android 示例 参考 方法 alert() React TSXstatic alert (
title: string,
message?: string,
buttons?: AlertButton[],
options?: AlertOptions,
);
参数： 名称类型说明title 必填string警告框的标题。传 null 或空字符串将隐藏标题。messagestring可选，显示在标题下方的信息。buttonsAlertButton[]可选的按钮配置数组。optionsAlertOptions可选的警告框配置。 prompt() iOS React TSXstatic prompt: (
title: string,
message?: string,
callbackOrButtons?: ((text: string) => void) | AlertButton[],
type?: AlertType,
defaultValue?: string,
keyboardType?: string,
);
以警告框的形式创建并显示一个文本输入提示。 参数： 名称类型说明title 必填string警告框的标题。messagestring可选，显示在输入框上方的信息。callbackOrButtonsfunction | AlertButton[]如果传入函数，会在提示结束后携带输入值调用
```html (text: string) => void，当用户点击“确定”时触发。若传入数组，按钮将根据数组内容配置。 typeAlertType 此属性配置文本输入。 defaultValue string 文本输入框的默认文本。 keyboardType string 第一个文本输入框的键盘类型（如果存在）。取值为 TextInput keyboardTypes 之一。 options AlertOptions 可选的 Alert 配置。 类型定义 AlertButtonStyle iOS iOS 的 Alert 按钮样式。 类型 enum 常量： 值描述 'default' 默认按钮样式。 'cancel' 取消按钮样式。 'destructive' 破坏性按钮样式。 AlertType iOS iOS 的 Alert 类型。 类型 enum 常量： 值描述 'default' 无输入框的默认警报。 'plain-text' 纯文本输入警报。 'secure-text' 安全文本输入警报。 'login-password' 登录和密码警报。 AlertButton 一个描述警报中按钮配置的对象。 类型 object 数组 对象属性： 名称类型描述 text string 按钮标签。 onPress function 按钮被按下时的回调函数。 style iOS AlertButtonStyle 按钮样式。在 Android 上此属性会被忽略。 isPreferred iOS boolean 是否强调显示该按钮。在 Android 上此属性会被忽略。 AlertOptions 类型 object 属性： 名称类型描述 cancelable Android boolean 定义是否可以通过点击警报框外部来关闭警报。 userInterfaceStyle iOS string 警报使用的界面样式，可设置为 light 或 dark，否则使用默认的系统样式。 onDismiss Android function 警报被关闭时触发的回调函数。 ```
{cancelable: true}。 可以通过在 options 参数中传入 onDismiss 回调来处理取消事件。 Android 示例 参考 方法 alert() React TSXstatic alert (
title: string,
message?: string,
buttons?: AlertButton[],
options?: AlertOptions,
);
参数： 名称类型说明title 必填string警告框的标题。传 null 或空字符串将隐藏标题。messagestring可选，显示在标题下方的信息。buttonsAlertButton[]可选的按钮配置数组。optionsAlertOptions可选的警告框配置。 prompt() iOS React TSXstatic prompt: (
title: string,
message?: string,
callbackOrButtons?: ((text: string) => void) | AlertButton[],
type?: AlertType,
defaultValue?: string,
keyboardType?: string,
);
以警告框的形式创建并显示一个文本输入提示。 参数： 名称类型说明title 必填string警告框的标题。messagestring可选，显示在输入框上方的信息。callbackOrButtonsfunction | AlertButton[]如果传入函数，会在提示结束后携带输入值调用
```html (text: string) => void，当用户点击“确定”时触发。若传入数组，按钮将根据数组内容配置。 typeAlertType 此属性配置文本输入。 defaultValue string 文本输入框的默认文本。 keyboardType string 第一个文本输入框的键盘类型（如果存在）。取值为 TextInput keyboardTypes 之一。 options AlertOptions 可选的 Alert 配置。 类型定义 AlertButtonStyle iOS iOS 的 Alert 按钮样式。 类型 enum 常量： 值描述 'default' 默认按钮样式。 'cancel' 取消按钮样式。 'destructive' 破坏性按钮样式。 AlertType iOS iOS 的 Alert 类型。 类型 enum 常量： 值描述 'default' 无输入框的默认警报。 'plain-text' 纯文本输入警报。 'secure-text' 安全文本输入警报。 'login-password' 登录和密码警报。 AlertButton 一个描述警报中按钮配置的对象。 类型 object 数组 对象属性： 名称类型描述 text string 按钮标签。 onPress function 按钮被按下时的回调函数。 style iOS AlertButtonStyle 按钮样式。在 Android 上此属性会被忽略。 isPreferred iOS boolean 是否强调显示该按钮。在 Android 上此属性会被忽略。 AlertOptions 类型 object 属性： 名称类型描述 cancelable Android boolean 定义是否可以通过点击警报框外部来关闭警报。 userInterfaceStyle iOS string 警报使用的界面样式，可设置为 light 或 dark，否则使用默认的系统样式。 onDismiss Android function 警报被关闭时触发的回调函数。 ```
