bee-ui/src/Header/index.js

import React from 'react';

import {
  Text, TouchableWithoutFeedback, View,
} from 'react-native';

import PropTypes from 'prop-types';

function noop() {}

function Header({
  left, right,
  onPressLeft, onPressRight,
  children, style,
}) {
  return (
    <View style={[Header.Style, style]}>
      {left || (
        <TouchableWithoutFeedback onPress={onPressLeft}>
          <Text>取消</Text>
        </TouchableWithoutFeedback>
      )}
      {children}
      {right || (
        <TouchableWithoutFeedback onPress={onPressRight}>
          <Text>确定</Text>
        </TouchableWithoutFeedback>
      )}
    </View>
  );
}

Header.Style = {
  flexDirection: 'row',
  justifyContent: 'space-between',
  alignItems: 'center',
  minHeight: 48,
};

Header.propTypes = {
  left: PropTypes.node,
  right: PropTypes.node,
  onPressLeft: PropTypes.func,
  onPressRight: PropTypes.func,
  children: PropTypes.node,
  style: View.propTypes.style,
};

Header.defaultProps = {
  left: null,
  right: null,
  onPressLeft: noop,
  onPressRight: noop,
  children: null,
  style: null,
};

export default Header;