ReactNative Alert详解及实例代码

Alert顾名思义一就是一个警告框，一般使用情况比如：退出登录，清楚缓存，提示修改密码等等。。。ReactNative中的Alert只有一个静态方法alert()其中有四个参数：标题，信息，按钮和按钮类型 在Android按钮至多有三个 下面是使用情况：

实例代码：

/**
* Created by Administrator on 2016/9/12.
*/
import React, {Component} from 'react';
import {
StyleSheet,
View,
Text,
Alert,
} from 'react-native';
class AlertG extends Component {
render() {
return (
<View style={{flex: 1}}>
<Text
style={styles.text}
onPress={()=> this.showOneAlert()}>One</Text>
<Text
style={styles.text}
onPress={()=> this.showTwoAlert()}>Two</Text>
<Text
style={styles.text}
onPress={()=> this.showThreeAlert()}>Three</Text>
</View>
)
}
showOneAlert() {
Alert.alert(
'Alert 标题',
'只有一个按钮',
[
/**
* 注意参数名字一定不能错
*/
{text: '确定', onPress: ()=> console.log('点击确定')}
]);
}
showTwoAlert() {
Alert.alert(
'Alert 标题',
'两个按钮',
[
{text: '确定', onPress: ()=> console.log('点击确定')},
{text: '取消', onPress: ()=> console.log('点击取消')}
]
);
}
showThreeAlert() {
Alert.alert(
'Alert 标题',
'三个按钮',
[
//第一个和第二个按钮的位置会颠倒
{text: '取消', onPress: ()=> console.log('点击取消')},
{text: '确定', onPress: ()=> console.log('点击确定')},
{text: '稍后', onPress: ()=> console.log('点击稍后')},
]
);
}
}
const styles = StyleSheet.create({
text: {
fontSize: 28
}
})
module.exports = AlertG;

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

您可能感兴趣的文章:

• ReactNative (API)AsyncStorage存储详解及实例
• ReactNative-JS 调用原生方法实例代码
• ReactNative页面跳转实例代码
• Android React Native原生模块与JS模块通信的方法总结