初识react native

最新推荐文章于 2019-10-23 12:25:48 发布

爱做的小乌龟

最新推荐文章于 2019-10-23 12:25:48 发布

阅读量394

点赞数

分类专栏： ReactNativ

本文链接：https://blog.csdn.net/nhgfd/article/details/54382013

版权

ReactNativ 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一. ReactNative的组织导入

reactive 需要导入所使用的没一个组件
语法如下

import React, {Component} from 'react';
import {
    View,
    WebView,
    NativeModules,
    AppRegistry
} from 'react-native';
import VideoView from './VideoView';

二.ReactNative的样式
ReactNative中所有的样式都采用样式对象来代替传统的样式表。标准的做法就是利用StyleSheet库进行样式的编写。

var FirstProject = React.createClass({
    render:function() {
      return(
          <View style = {styles.container}>
            <Text style={styles.welcome}>
            Welcome to React Native
            </Text>
            <Text style = {styles.instructions}>
               To get started,edit index.ios.js
            </Text>


          </View>

      );
    }
});


    var styles = StyleSheet.create({

        container: {
            flex: 1,
            justifyContent :'center',
            alignItems:'center',
            backgroundColor:'#f5fcff',
        },
        welcome: {
            fontSize:20,
            textAlign:'center',
            margin:10,
        },
        instructions: {
            textAlign:'center',
            color:'#333333',
            marginBottom:5,
        },
    });