Rn中Text文本文件

2017-11-09  本文已影响21人  基本密码宋

用于展现文字的 和Android中TextView差不多

    <View>
                <Text style={styles.itemText}>我是一个   /*最外层的Text的样式可以对里面的Text的进行复用*/
                    <Text style={{color:'red',fontSize:44}}>
                        好学生
                    </Text>
                </Text>
            </View>

当然你也可以自定义Text 用于统一的管理你文本器

class HeadText extends Component{

    render(){
        return (
            <Text style={[styles.itemText,{color:'pink'}]}>
                {this.props.children}
            </Text>
        );
    }
}

其他地方进行引用

export default class App extends Component<{}> {
    render() {
        return (

            <View>
                   <HeadText>
                       我是一个好学生
                   </HeadText>
            </View>



             /*<View style={styles.container}>
                <View style={[styles.item,styles.itemOne]}>
                    <Text style={styles.itemText}>
                        1
                    </Text>
                </View>
                <View style={[styles.item,styles.itemTwo]}>
                    <Text style={styles.itemText}>
                        2
                    </Text>
                </View>
                <View style={[styles.item,styles.itemThree]}>
                    <Text style={styles.itemText}>
                        3
                    </Text>
                </View>
            </View>*/
        );
    }
}

``
上一篇 下一篇

猜你喜欢

热点阅读