方法
static alert(title: string,message?: string,buttons?: Array<{ text: ?string; onPress?: ?Function; }>,type?: string):无输入弹出框
static prompt(title: string,value?: string,callback?: Function):带输入框的弹出框
实例
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS",WITHOUT WARRANTY OF ANY KIND,EXPRESS
* OR IMPLIED,INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM,DAMAGES OR OTHER LIABILITY,WHETHER IN
* AN ACTION OF CONTRACT,TORT OR OTHERWISE,ARISING FROM,OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,View,Text,TouchableHighlight,AlertIOS,} = React;
exports.framework = 'React';
exports.title = 'AlertIOS';
exports.description = 'iOS alerts and action sheets';
exports.examples = [{
title: 'Alerts',render() {
return (
<View>
<TouchableHighlight style={styles.wrapper}
onPress={() => AlertIOS.alert(
'Foo Title','My Alert Msg'
)}>
<View style={styles.button}>
<Text>Alert with message and default button</Text>
</View>
</TouchableHighlight>
<TouchableHighlight style={styles.wrapper}
onPress={() => AlertIOS.alert(
null,null,[
{text: 'Button',onPress: () => console.log('Button Pressed!')},]
)}>
<View style={styles.button}>
<Text>Alert with only one button</Text>
</View>
</TouchableHighlight>
<TouchableHighlight style={styles.wrapper}
onPress={() => AlertIOS.alert(
'Foo Title','My Alert Msg',[
{text: 'Foo',onPress: () => console.log('Foo Pressed!')},{text: 'Bar',onPress: () => console.log('Bar Pressed!')},]
)}>
<View style={styles.button}>
<Text>Alert with two buttons</Text>
</View>
</TouchableHighlight>
<TouchableHighlight style={styles.wrapper}
onPress={() => AlertIOS.alert(
'Foo Title',{text: 'Baz',onPress: () => console.log('Baz Pressed!')},]
)}>
<View style={styles.button}>
<Text>Alert with 3 buttons</Text>
</View>
</TouchableHighlight>
<TouchableHighlight style={styles.wrapper}
onPress={() => AlertIOS.alert(
'Foo Title','..............'.split('').map((dot,index) => ({ text: 'Button ' + index,onPress: () => console.log('Pressed ' + index) })) )}> <View style={styles.button}> <Text>Alert with too many buttons</Text> </View> </TouchableHighlight> </View> ); } },{ title: 'Prompt',render(): React.Component { return <PromptExample /> } }]; class PromptExample extends React.Component { constructor(props) { super(props); this.promptResponse = this.promptResponse.bind(this); this.state = { promptValue: undefined,}; this.title = 'Type a value'; this.defaultValue = 'Default value'; this.buttons = [{ text: 'Custom cancel',},{ text: 'Custom OK',onPress: this.promptResponse }]; } render() { return ( <View> <Text style={{marginBottom: 10}}> <Text style={{fontWeight: 'bold'}}>Prompt value:</Text> {this.state.promptValue} </Text> <TouchableHighlight style={styles.wrapper} onPress={this.prompt.bind(this,this.title,this.promptResponse)}> <View style={styles.button}> <Text> prompt with title & callback </Text> </View> </TouchableHighlight> <TouchableHighlight style={styles.wrapper} onPress={this.prompt.bind(this,this.buttons)}> <View style={styles.button}> <Text> prompt with title & custom buttons </Text> </View> </TouchableHighlight> <TouchableHighlight style={styles.wrapper} onPress={this.prompt.bind(this,this.defaultValue,this.promptResponse)}> <View style={styles.button}> <Text> prompt with title,default value & callback </Text> </View> </TouchableHighlight> <TouchableHighlight style={styles.wrapper} onPress={this.prompt.bind(this,this.buttons)}> <View style={styles.button}> <Text> prompt with title,default value & custom buttons </Text> </View> </TouchableHighlight> </View> ); } prompt() { // Flow's apply support is broken: #7035621 ((AlertIOS.prompt: any).apply: any)(AlertIOS,arguments); } promptResponse(promptValue) { this.setState({ promptValue }); } } var styles = StyleSheet.create({ wrapper: { borderRadius: 5,marginBottom: 5,button: { backgroundColor: '#eeeeee',padding: 10,});