RN-底部弹窗

介绍一款弹窗方法:

导入

import ActionSheet from 'react-native-actionsheet'; //弹窗

头部设置参数

const buttons = ['取消', '扫一扫'];
const CANCEL_INDEX = 0;
const DESTRUCTIVE_INDEX = 1;

渲染render设置REF

 this.ActionSheet = o}
                            title="选择添加好友"
                            options={buttons}
                            cancelButtonIndex={CANCEL_INDEX}
                            destructiveButtonIndex={DESTRUCTIVE_INDEX}
                            onPress={this._handlePress.bind(this)}
                        />

使用方法

在要点击的事件地方放入方法:

this.ActionSheet.show();

设置各选项的事件和逻辑

// 头部弹窗方法
    _handlePress(index) {
        if(index==1){  //扫一扫
            alert('1');
        }else if(index==2){
            //alert('2');
        }
    }

你可能感兴趣的:(RN-底部弹窗)