@ant-design/react-native/es/action-sheet/demo/basic.js

基于蚂蚁金服移动设计规范的 React Native 组件库

import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
import React from 'react';
import { View, Text, Platform } from 'react-native';
import { ActionSheet, Button } from '../../';

var Test = function (_React$Component) {
    _inherits(Test, _React$Component);

    function Test(props) {
        _classCallCheck(this, Test);

        var _this = _possibleConstructorReturn(this, (Test.__proto__ || Object.getPrototypeOf(Test)).call(this, props));

        _this.showActionSheet = function () {
            var BUTTONS = ['Operation1', 'Operation2', 'Operation3', 'Delete', 'Cancel'];
            ActionSheet.showActionSheetWithOptions({
                title: 'Title',
                message: 'Description',
                options: BUTTONS,
                cancelButtonIndex: 4,
                destructiveButtonIndex: 3
            }, function (buttonIndex) {
                _this.setState({ clicked: BUTTONS[buttonIndex] });
            });
        };
        _this.showShareActionSheet = function () {
            var opts = {
                message: 'Message to go with the shared url',
                title: 'Share Actionsheet'
            };
            if (Platform.OS === 'ios') {
                opts.url = 'https://www.alipay.com/';
                opts.tintColor = '#ff0000';
                opts.excludedActivityTypes = ['com.apple.UIKit.activity.PostToTwitter'];
            }
            ActionSheet.showShareActionSheetWithOptions(opts, function (error) {
                return alert(error);
            }, function (success, method) {
                var text = void 0;
                if (success) {
                    text = 'Shared with ' + method;
                } else {
                    text = 'Did not share';
                }
                _this.setState({ text: text });
            });
        };
        _this.state = {
            clicked: 'none',
            text: ''
        };
        return _this;
    }

    _createClass(Test, [{
        key: 'render',
        value: function render() {
            return React.createElement(
                View,
                { style: { marginTop: 30 } },
                React.createElement(
                    View,
                    { style: [{ padding: 8 }] },
                    React.createElement(
                        Button,
                        { onPress: this.showActionSheet },
                        'showActionSheet'
                    )
                ),
                React.createElement(
                    Text,
                    { style: [{ padding: 8 }] },
                    'clicked button: ',
                    this.state.clicked
                ),
                React.createElement(
                    View,
                    { style: [{ padding: 8 }] },
                    React.createElement(
                        Button,
                        { onPress: this.showShareActionSheet },
                        'showShareActionSheet'
                    )
                ),
                React.createElement(
                    Text,
                    { style: [{ padding: 8 }] },
                    this.state.text
                )
            );
        }
    }]);

    return Test;
}(React.Component);

export default Test;

export var title = 'ActionSheet';
export var description = 'ActionSheet example';