rn-project/src/pages/actionSheet.js

#### 项目介绍 类似一个脚手架的工具 此项目致力于构建一套基础，简单，可维护的 适配我司的react-native项目。可在此基础上搭建项目，封装了基础架构，基础组件，以及各种交互等；可快速进行项目搭建，开发。 # 涉及主要技术 - 1. 项目主要架构 * react native * react-navigation * redux

import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';

import { SafeAreaView } from 'react-navigation';
import BaseStyle from '../constants/Style';
import Btn from '../components/buttons';
import { ActionSheet, ActionDom } from '../components/actionsheet';

export default class RadioScreen extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showAction: false,
      showAction2: false,
    };
  }

  render() {
    return (
      <SafeAreaView
        style={[BaseStyle.flex, styles.homebg]}
        forceInset={{ top: 'never' }}>
        <ActionSheet
          showAction={this.state.showAction}
          cancel={() => {
            this.setState({ showAction: false });
          }}>
          <ActionDom
            actionName={'我是按钮一'}
            onPress={() => {
              toast('你点击了按钮一');
            }}
          />
          <ActionDom
            actionName={'我是按钮二'}
            onPress={() => {
              alert('你点击了按钮二');
            }}
          />
        </ActionSheet>

        <ActionSheet
          title={'请选择条件'}
          showAction={this.state.showAction2}
          cancel={() => {
            this.setState({ showAction2: false });
          }}>
          <ActionDom
            actionName={'我是按钮一'}
            onPress={() => {
              toast('你点击了按钮一');
            }}
          />
          <ActionDom
            actionName={'我是按钮二'}
            onPress={() => {
              alert('你点击了按钮二');
            }}
          />
          <ActionDom
            actionName={'我是按钮三'}
            onPress={() => {
              alert('你点击了按钮三');
            }}
          />
        </ActionSheet>

        <View style={styles.container}>
          <Btn
            text={'action - sheet'}
            onPress={() => {
              this.setState({
                showAction: true,
              });
            }}
          />

          <Btn
            text={'带标题'}
            underlayColor={'#31bcfe'}
            btnStyle={{ marginTop: 30, backgroundColor: '#31bcfe' }}
            onPress={() => {
              this.setState({
                showAction2: true,
              });
            }}
          />
        </View>
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  homebg: {
    backgroundColor: '#eee',
  },
  container: {
    ...BaseStyle.flex,
    paddingTop: 20,
  },
});