1. 程式人生 > >react native ActionSheetIOS 使用詳解

react native ActionSheetIOS 使用詳解

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> ); } }

這裡寫圖片描述