React-Native alertView彈框代碼
最近在學習React-Native基本知識,以下代碼是根據官網上的代碼示例運行成功的
import React, {
AppRegistry,
Alert,
Component,
StyleSheet,
TouchableHighlight,
Navigator,
Text,
View
} from 'react-native';
var alertMessage = 'Credibly reintermediate next-generation
potentialities after goal-oriented ' +
'catalysts for change. Dynamically
revolutionize.';
var seProject = React.createClass({
render: function() {
return (
onPress={() =>
Alert.alert(
'Alert
Title',
alertMessage,
)}>
Alert with
message and default button
onPress={() =>
Alert.alert(
'Alert
Title',
alertMessage,
[
{text: 'OK', onPress: () => console.log('OK
Pressed!')},
]
)}>
Alert with
one button
onPress={() =>
Alert.alert(
'Alert
Title',
alertMessage,
[
{text: 'Cancel', onPress: () =>
console.log('Cancel Pressed!')},
{text: 'OK', onPress: () => console.log('OK
Pressed!')},
]
)}>
Alert with
two buttons
onPress={() =>
Alert.alert(
'Alert
Title',
null,
[
{text: 'Foo', onPress: () => console.log('Foo
Pressed!')},
{text: 'Bar', onPress: () => console.log('Bar
Pressed!')},
{text: 'Baz', onPress: () => console.log('Baz
Pressed!')},
]
)}>
Alert with
three buttons
onPress={() =>
Alert.alert(
'Foo
Title',
alertMessage,
'..............'.split('').map((dot, index) => ({
text: 'Button ' + index,
onPress: () => console.log('Pressed ' +
index)
}))
)}>
Alert with
too many buttons
);
},
});
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent:
'center',
alignItems:
'center',
backgroundColor:
'#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign:
'center',
margin: 10,
color:'orange'
},
welcomeContainer: {
height:70,
width:300,
backgroundColor:
'green',
},
instructions: {
textAlign:
'center',
color: 'orange',
marginBottom: 5,
},
wrapper: {
borderRadius: 5,
marginBottom: 5,
},
button: {
backgroundColor:
'#eeeeee',
padding: 10,
},
});
AppRegistry.registerComponent('seProject', () =>
seProject);
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.