1.大括号

请注意{pic}外围有一层括号，我们需要用括号来把pic这个变量嵌入到JSX中。括号的意思是括号的内部是一个js变量或者表达式，需要执行后取值。因此我们可以把任意合法的JavaScript表达式通过括号嵌入到JSX语句中.

2.弹性（Flex）宽高

在组件样式中使用flex可以使其在可利用的空间中动态地扩张或收缩。一般而言我们会使用flex:1来指定某个组件扩张以撑满所有剩余的空间。如果有多个并列的子组件使用了flex:1，则这些子组件会平分父容器中剩余的空间。如果这些并列的子组件的flex值不一样，则谁的值更大，谁占据剩余空间的比例就更大（即占据剩余空间的比等于并列组件间flex值的比）。

组件能够撑满剩余空间的前提是其父容器的尺寸不为零。如果父容器既没有固定的width和height，也没有设定flex，则父容器的尺寸为零。其子组件如果使用了flex，也是无法显示的

3.ListView

ListView组件用于显示一个垂直的滚动列表，其中的元素之间结构近似而仅数据不同。
ListView更适于长列表数据，且元素个数可以增删。和ScrollView不同的是，ListView并不立即渲染所有元素，而是优先渲染屏幕上可见的元素。ListView组件必须的两个属性是dataSource和renderRow。dataSource是列表的数据源，而renderRow则逐个解析数据源中的数据，然后返回一个设定好格式的组件来渲染。创建了一个简单的ListView，并预设了一些模拟数据。首先是初始化ListView所需的dataSource，其中的每一项（行）数据之后都在renderRow中被渲染成了Text组件，最后构成整个ListView。

rowHasChanged函数也是ListView的必需属性。这里我们只是简单的比较两行数据是否是同一个数据（===符号只比较基本类型数据的值，和引用类型的地址）来判断某行数据是否变化了

4.ListView 九宫格

//一些常量设置 var cols=3;//列数 var cellWH =100;//cell宽高 var vMargin=（screenWidth-cellWH*cols）/(cols+1);//左右间距 var hMargin = 25；//上下间距 ES5写法： getDefaultProps(){//设置默认值，固定值 及 上下界面的两个数据传递         return{ }}， getInitialState(){//设置一些初始值（可以变化的）      //创建数据源       var ds = new ListView.DataSource({rowHasChaged:(r1,r2)=>r1 !== r2});      return{           dataSource: ds.cloneWithRows(shareData.data) }} render(){     return(                     ); },

每个cell的数据填充 note:上张图片中 “rowData.title”,如果不加{}的话，就是一个常量，cell出来之后显示同一个数据内容；加上{}，就成了变量，才可以每一cell正常的显示不同的数据批量数据的处理，要在componentDidMount(){}里做，比如：数据加载 或者 异步操作（定时器）

componentDidMount(){                   //调用json数据                  this.loadDataFromJson(); }， loadDataFromJson(){
          //dataBlob是一个对象类型             //定义一些变量                  Var dataBlob ={},                  sectopmIDs=[],                  rowIDs =[];

加载cell和section数据

5.TabBarIOS界面之间的切换

选项卡的设置

6.常用组件之Navigator和NavigatoriIOS

包装了UIKIt的导航功能，可以使用左划功能来返回到上一个界面replace 替换当前页面的路由，并且立即加载新路由的试图barTintColor string //导航条的背景颜 {MOD}initialRoute  框架性的一些东西：创建几个js文件

//输出类 module.exports = Main;

//所有的问题都是就main产生的//引入我们外部的组件var home  =require('./Component/XHGhome');tabbar切换界面时，上下级界面要跳转必须先包装一个导航，不能直接放一个view让导航占据整个屏幕 style{flex:1};请求网络数据在componentDidMount(){//通过fetch来进行网络请求由标准居委会提出，并且已经在}//做一些本地数据，没网络的时候从本地加载.catch((error)=>{if(error){//特殊处理，断网处理 }})上级界面传值到子界面：1.导入外部的组件类、加一个text，我是标题
用this.Props.imageDataArr传过来

//  note: 调试时用 debugger;  来打断点

安卓放APP图片：//往安卓拖的文件夹必须以：drawable-xxhdpi来命名，放到 放安卓图片到这个文件夹里 //安卓里面加载图片必须都是小写只要图片名有大写就会报错

cd   npm i  react-native-tab-navigator --save //下载的一个nav and tar框架, 先看README，将框架引入进来，说明里有介绍方法和属性

//  Platform   //判断当前运行的系统 eg: width: Platform.OS === 'ios' ? 30:25

//传递变量一定要加{}