React Native Lazy View

LazyView.js

import React from 'react';
import {View } from 'react-native';

/*
	@description: for lazy people who don't give a fuck on performances
	it's working for only ONE child!

	<LazyView topleft|top|topright|left|center|right|bottomleft|bottom|right>
		<View
			style={{
				flex:1,
				width: 150
				backgroundColor:"red"
			}}
		/>
	</LazyView>
*/
export default  class LazyView extends React.Component {

	render() {
		let options = {};

		const lineStyle = {
			flex: 1,
			alignSelf: "stretch",
			backgroundColor: this.props.debug ? "cyan" : "transparent",
			marginLeft: 2,
			marginRight: 2,
			marginTop: 2,
			marginBottom: 2,
		};

		const childContainer = {
			backgroundColor: this.props.debug ? "yellow" : "transparent",
			flex: 1,
		}

		let type = 0;

		options.backgroundColor = this.props.debug ? "grey" : "transparent"
		options.flex = 1;

		const left = () => {
			lineStyle.alignItems = "center";
			lineStyle.flexDirection =  "column";
			childContainer.alignItems = "center";
			childContainer.alignSelf = "flex-start";
		}

		const center = () => {
			lineStyle.alignItems = "center";
			lineStyle.flexDirection = "column";
			childContainer.alignItems = "center";
			childContainer.alignSelf = "center";
		}

		const right = () => {
			lineStyle.alignItems = "center";
			lineStyle.flexDirection = "column";
			childContainer.alignItems = "center";
			childContainer.alignSelf = "flex-end";
		}

		if (this.props.topleft || this.props.top || this.props.topright) {
			type = 0;
			if (this.props.topleft) {
				left();
			} else if (this.props.topright) {
				right();
			} else if (this.props.top) {
				center();
			}
		} else if (this.props.left || this.props.center || this.props.right) {
			type = 1;
			if (this.props.left) {
				left();
			} else if (this.props.right) {
				right();
			} else if (this.props.center) {
				center();
			}
		} else if (this.props.bottomleft || this.props.bottom || this.props.bottomright) {
			type = 2;
			if (this.props.bottomleft) {
				left();
			} else if (this.props.bottomright) {
				right();
			} else if (this.props.bottom) {
				center();
			}
		}

		return (
			<View
				pointerEvents="box-none"
				style={[options, this.props.style]}
			>
				<View
					pointerEvents="box-none"
					style={lineStyle}>
					{
						type == 0 ? <View style={childContainer}>{this.props.children}</View> : null
					}
				</View>
				<View
					pointerEvents="box-none"
					style={lineStyle}>
					{
						type == 1 ? <View style={childContainer}>{this.props.children}</View> : null
					}
				</View>
				<View
					pointerEvents="box-none"
					style={lineStyle}>
					{
						type == 2 ? <View style={childContainer}>{this.props.children}</View> : null
					}
				</View>
			</View>
		  );
	}

}