react native ActionSheetIOS 使用详解

最新推荐文章于 2024-11-13 13:01:44 发布

老孟Flutter

最新推荐文章于 2024-11-13 13:01:44 发布

阅读量1.8k

点赞数

分类专栏： react native 学习之旅文章标签： react native ActionShee

本文链接：https://blog.csdn.net/mengks1987/article/details/72652292

版权

react native 学习之旅专栏收录该内容

44 篇文章

订阅专栏

ActionSheetIOS 有2个方法：
1、showActionSheetWithOptions(options: Object, callback: Function)

options：（字符串数组）按钮的标题（必选）
cancelButtonIndex：选项中取消按钮索引
destructiveButtonIndex：选项中删除按钮索引
title：顶部的标题
message：标题下方的信息

2、showShareActionSheetWithOptions(options: Object, failureCallback: Function, successCallback: Function)

message：要分享的信息
url：分享的URL地址
subject：分享的信息主题
excludedActivityTypes：在actionsheet中不显示的活动

/**
 * Created by![这里写图片描述](https://img-blog.csdn.net/20170523172118863?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbWVuZ2tzMTk4Nw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast) on 2017/5/23.
 */
import React, {Component} from 'react';
import {
    StyleSheet,
    View,
    ActionSheetIOS,
    Button,
    Alert,
} from 'react-native';

export default class ActionSheetIOSDemo extends Component {

    _onPress = ()=>{
        ActionSheetIOS.showActionSheetWithOptions({
            options:['option1','option2','取消','删除'],
            cancelButtonIndex:2,
            destructiveButtonIndex:3,
            title:'title',
            message:'message',
        },(index)=>{
            Alert.alert('选中：'+index);
        })
    }

    _onPress1 = ()=>{
        ActionSheetIOS.showShareActionSheetWithOptions({
            message:'message',
            url:'http://blog.csdn.net/mengks1987',
            subject:'subject',
            title:'title',
            message:'message',
        },()=>{

        },()=>{

        })
    }

    render() {
        return (
            <View style={{flex:1}}>
                <Button title='弹出' onPress={this._onPress}/>
                <Button title='弹出分享' onPress={this._onPress1}/>
            </View>
        );
    }
}