react-native学习(二)

在程序的主目录下建立文件夹App，用于盛放我们写的js文件，在此文件夹下依次建立文件夹View/Home。并建立Index.js文件。

在Home文件夹下建立Groups.js文件，用atom编辑器打开。

添加如下代码：

'use strict';

 

var React = require('react-native');

var {

 StyleSheet,

 Text,

 View,

 Image

  } =React;

var GroupsView = React.createClass({

 render: function () {

   return (

     <View style={styles.container}>

     </View>

   );

  }

});

var styles = React.StyleSheet.create({

 container: {

   backgroundColor: '#ffffff',

   flex: 1,

  }

});

module.exports = GroupsView;

这样我们就创建了一个背景是白色，flex为1（此处就是占满整个屏幕）、名字为GroupsView的界面，

var GroupsView = React.createClass({

 render: function () {

   return (

     <View style={styles.container}>

     </View>

   );

  }

});

render: function ()就是渲染界面，需要在界面上添加别的一些控件，都可以在这里面添加。貌似是react-native每次界面显示的时候，都会调用此方法，也就是只要是显示，就需要先进行界面渲染。

var {

 StyleSheet,

 Text,

 View,

 Image

  } =React;

这种声明方