React APIモジュールのAlertポップアップボックスの詳細と使用


( )  
 Alert           ,              。                ,            onPress        。     ,       '  '  。
   API  Android、iOS            。                       ,     AlertIOS;            iOS  。
( )iOS    
  iOS           button,              ,     'default','cancel','destructive'      。
( )Android    
iOS           button,   Android              。Android          '   ','  ','  '    
1.'positive' (  :  )
2.'negative','positive' (  :  ,  )
3.'neutral','negative','positive'(  :    ,'  ','  ')
( )Alert  
static alert(title:string,message?:string,buttons?:Buttons,type?:AlertType)    Alert           ,     ,     ,  ,  ,         
( )Alert    
       Alert       ,               ,      :
/**
 * React Native Alert        
 * https://github.com/facebook/react-native
 */
'use strict';
import React, {
  AppRegistry,
  Component,
  StyleSheet,
  Text,
  View,
  Alert,
  ToastAndroid,
  TouchableHighlight,
} from 'react-native';
class CustomButton extends React.Component {
  render() {
    return (
      "#a5a5a5"
        onPress={this.props.onPress}>
        {this.props.text}
      
    );
  }
}
class AlertDemo extends Component {
  render() {
    return (
      
        height:30,color:'black',margin:8}}>
               
        
        '      Alert'
          onPress={()=>Alert.alert('    ','     ?')}
          />
        '         Alert'
          onPress={()=>Alert.alert('    ','     ?',[
            {text:'  ',onPress:()=>ToastAndroid.show('      ~',ToastAndroid.SHORT)},
            {text:'  ',onPress:()=>ToastAndroid.show('      ~',ToastAndroid.SHORT)}
            ])}
          />
        '         Alert'
          onPress={()=>Alert.alert('    ','     ?',[
            {text:'One',onPress:()=>ToastAndroid.show('    One~',ToastAndroid.SHORT)},
            {text:'Two',onPress:()=>ToastAndroid.show('    Two~',ToastAndroid.SHORT)},
            {text:'Three',onPress:()=>ToastAndroid.show('    Three~',ToastAndroid.SHORT)}
            ])}
          />
      
    );
  }
}
const styles = StyleSheet.create({
  button: {
    margin:5,
    backgroundColor: 'white',
    padding: 15,
    borderBottomWidth: StyleSheet.hairlineWidth,
    borderBottomColor: '#cdcdcd',
  }
});

AppRegistry.registerComponent('AlertDemo', () => AlertDemo);
      :
(http://img.blog.csdn.net/20171127112159172?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd2VpeGluXzM4MjgzMjcw/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)

( )    
    ,     :From Skyhttp://www.lcode.org/)     !