This is a custom component for React Native, a simple popup, compatible with ios and android.
###Props
- isOverlay bool -
default true
- isOverlayClickClose bool -
default true
### Methodsstatic
- alert(
message
: string|number, [...])
e.g.
this.popup.alert(1);
this.popup.alert(1, 'two', '10 messages at most');
- tip({
title
: string,content
: string|number|array<string|number>isRequired
,btn
: {title
: stringdefault 'OK'
,callback
: function}, })
e.g.
this.popup.tip({
content: 'come on!',
});
this.popup.tip({
title: 'TipTip',
content: 'come on!',
});
this.popup.tip({
content: ['come on!', 'go!'],
btn: {
text: 'OKOK',
callback: () => {
this.popup.alert('over!');
},
},
});
- confirm({
title
: string,content
: string|number|array<string|number>isRequired
,ok
: {title
: stringdefault 'OK'
,callback
: function},cancel
: {title
: stringdefault 'Cancel'
,callback
: function}, })
e.g.
this.popup.confirm({
content: 'Are you ready?',
});
this.popup.confirm({
content: 'Are you ready?',
ok: {
callback: () => {
this.popup.alert('Very good!');
},
},
});
this.popup.confirm({
title: 'title',
content: ['come on!', 'go!'],
ok: {
text: 'Y',
callback: () => {
this.popup.alert('Good!');
},
},
cancel: {
text: 'N',
callback: () => {
this.popup.alert('Hurry up!');
},
},
});
###Usage
...
"dependencies": {
...
"react-native-popup": "beefe/react-native-popup",
...
}
...
npm install react-native-popup
import Popup from 'react-native-popup';
class App extends Component{
onPressHandle() {
this.popup.alert(1);
},
render() {
return (
<View style={styles.container}>
<Text style={styles.btn} onPress={this.onPressHandle.bind(this)}>click me !</Text>
{/** Popup component */}
<Popup ref={(popup) => { this.popup = popup }}/>
</View>
);
},
};