Nonvoluntary Professional Mangling

    react-native-popup

    0.6.1 • Public • Published

    react-native-popup

    npm version

    This is a custom component for React Native, a simple popup, compatible with ios and android.

    Demo

    ui

    Props

    • isOverlay bool - default true
    • isOverlayClickClose bool - default true

    static Methods

    • 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: string default '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',
                    style: {
                        color: 'red'
                    },
                    callback: () => {
                        this.popup.alert('over!');
                    },
                },
            });
    • confirm({ title: string, content: string|number|array<string|number> isRequired, ok: {title: string default 'OK', callback: function}, cancel: {title: string default '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',
                    style: {
                        color: 'red'
                    },
                    callback: () => {
                        this.popup.alert('Good!');
                    },
                },
                cancel: {
                    text: 'N',
                    style: {
                        color: 'blue'
                    },
                    callback: () => {
                        this.popup.alert('Hurry up!');
                    },
                },
            });

    Usage

    Step 1 - install

        npm install react-native-popup --save
    

    Step 2 - import and use in project

    import Popup from 'react-native-popup';
     
    class App extends React.Component{
     
        onPressHandle() {
            // alert
            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 }/>
                    {/** or <Popup ref={popup => this.popup = popup } isOverlay={false} isOverlayClickClose={false}/> */}
     
                </View>
            );
        },
        
    };

    Install

    npm i react-native-popup

    DownloadsWeekly Downloads

    3

    Version

    0.6.1

    License

    ISC

    Last publish

    Collaborators

    • rsk
    • zooble