react nativev Alert.alert 警告/中部弹窗 速通篇

在React Native中，Alert.alert是一个用于显示一个带有标题、信息、取消按钮以及一些可选操作按钮的警告弹窗的API。这个弹窗会在iOS和Android上显示为一个本地化的模态窗口。

以下是一个使用Alert.alert的基本示例：

import React, { Component } from 'react';
import { Alert, Button } from 'react-native';
 
export default class AlertExample extends Component {
  showAlert = () => {
    Alert.alert(
      '标题',
      '这是一个简单的警告弹窗',
      [
        {
          text: '取消',
          onPress: () => console.log('取消按钮被点击'),
          style: 'cancel',
        },
        { text: '确定', onPress: () => console.log('确定按钮被点击') },
      ],
      { cancelable: false }
    );
  };
 
  render() {
    return (
      <Button title="显示警告" onPress={this.showAlert} />
    );
  }
}

在这个例子中，当按钮被按下时，showAlert函数会被调用，它创建并显示一个包含标题、信息以及两个按钮的警告弹窗。其中一个按钮设置了style: 'cancel'，这表示它是一个取消按钮，它不会执行任何操作，只是关闭弹窗。另一个按钮是一个普通的操作按钮，点击会在控制台输出一条信息。cancelable选项被设置为false，这意味着用户不能通过点击背景或使用物理按键来取消弹窗。