React Native Button封装

react native 开发时，自带的button组件不能满足我们的开发需求。不支持背景图等设置。所以封装了一个简单的button 。代码如下

import React from "react";
import {
    Text,
    View,
    StyleSheet,
    TouchableOpacity,
    Image
} from "react-native";

const styles = StyleSheet.create({
    ButtonStyle: {
        justifyContent: "center",
        alignItems: "center"
    },
    contentStyle: {
        backgroundColor: "transparent"
    },
    Text: {
        textAlign: "center"
    },
    backgroundImage: {
        width: "100%",
        height: "100%",
        position: "absolute",
        zIndex: -2,
        alignSelf: "center"
    }
});

class Button extends React.Component {
    constructor(props) {
        super(props);
    }
    static defaultProps = {
        style: {},
        enable: true,
        textStyle: {},
        backgroundImage: null,
        backgroundImageStyle: {},
        type: "default"
    };

    render() {
        return (
            //可点击
            <TouchableOpacity
                onPress={this.props.onPress}
                style={[styles.ButtonStyle, this.props.style]}
                disabled={
                    this.props.hasOwnProperty("enable") ? !this.props.enable : false
                }
            >
                {this.props.hasOwnProperty("title") ? (
                    <Text
                        style={[styles.Text, this.props.textStyle]}
                    >
                        {this.props.title}
                    </Text>
                ) : null}
                {this.props.hasOwnProperty("backgroundImage") ? (
                    <Image
                        source={this.props.backgroundImage}
                        style={[styles.backgroundImage, this.props.backgroundImageStyle]}
                    />
                ) : null}
                <View style={styles.contentStyle} />
            </TouchableOpacity>
        );
    }
}

export default Button;