Submit                         

                    </Text> 

                </View>  

            </TouchableOpacity> 

        </View> 

        ); 

    } 

} 

一切样式都存储在一个独自的模块中。

包裹在TouchableOpacity中的button组件应该独自别离出来，这样才能方便我们以后重复运用它。Image组件，以后也能够重复运用，所以也应该把它别离出来。

做了一些改动之后的样子：

import React, { Component, PropTypes } from 'react'; 

import { 

    Text, 

    TextInput, 

    View, 

    TouchableOpacity 

} from 'react-native'; 

import styles from './styles.ios'; 

 

class Avatar extends Component{ 

    constructor(props){ 

        super(props); 

    } 

    render(){         

        if(this.props.imgSrc){             

            return(                 

                <View style={styles.avatarBlock}> 

                    <Image 

                        source={this.props.imgSrc} 

                        style={styles.avatar}/> 

                </View> 

             ) 

         } 

         return null; 

    } 

} 

Avatar.propTypes = { 

    imgSrc: PropTypes.object 

} 

 

class FormItem extends Component{ 

    constructor(props){ 

        super(props); 

    } 

    render(){ 

        let title = this.props.title; 

        return(  

            <View style={styles.formItem}> 

                <Text> 

(责任编辑：admin)