RN-Alert

消息框, ReactNative 提供了 Alert/AlertIOS

一、 AlertIOS

只适用于iOS设备, 提供的功能比Alert组件会更多

1 对画框类型

* alert(title, message, buttons):普通的消息提示对话框。其中 buttons 是对象数组。
* prompt(title, value, buttons):提供可输入的对话框。其中 buttons 是对象数组。

2 对话框样式

* 如果没有设置 buttons 数组,AlertIOS 组件默认会有一个“确认”按钮。
* 默认情况下,buttons 数组的最后一个按钮会高亮显示。
* 如果数组的长度过长按钮就会垂直排列。

3 代码效果

RN-Alert_第1张图片

RN-Alert_第2张图片

RN-Alert_第3张图片

RN-Alert_第4张图片
/**
 * Created by licc on 2017/7/9.
 */

import React, {Component } from 'react';
import {
    StyleSheet,
    View,
    Text,
    AlertIOS
} from 'react-native';
import NavigationBar from './NavigationBar'

export default class AlertExample extends Component {

    render(){
        return(
            
                
                提示对话框
                输入对话框
                输入密码
                登录框
            
        );
    }

    doTip(){
        AlertIOS.alert('提示', '欢迎您来到ReactNative世界', [
            {
                text:'取消',
                onPress:()=>{
                    console.log('点击取消按钮');
                }
            },
            {
                text:'确认',
                onPress:()=>{
                    console.log('点击确认按钮');
                }
            },

        ]);
    }

    doInput(){
        AlertIOS.prompt('提示', '请输入内容....', [

            {
                text:'取消',
                onPress:()=>{
                    console.log('点击取消按钮');
                }
            },
            {
                text:'确认',
                onPress:()=>{
                    console.log('点击确认按钮');
                }
            },
        ]);
    }

    doInputSecure(){

        AlertIOS.prompt('Secure Text', null, null, 'secure-text');
    }

    doLogin(){
        AlertIOS.prompt('Login & Password', null, null, 'login-password');
    }

}

const styles = StyleSheet.create({

    container:{
      flex:1
    },

    item:{
        marginTop:10,
        marginLeft:5,
        marginRight:5,
        height:30,
        borderWidth:1,
        padding:6,
        borderColor:'#ddd',
        textAlign:'center'
    },
});

二 Alert

Alert 组件是 iOS 设备和 Android 设备都通用的。不过它只有一个普通的消息提示对话框类型。
Alert 方法的用法和 AlertIOS 组件是一样的

* alert(title, message, buttons):普通的消息提示对话框。其中 buttons 是对象数组。

你可能感兴趣的:(RN-Alert)