析构赋值

  let react = {
                 uri:'https',
                 des:'desct',
                 price:12,
                  };

上面等价于

react.uri = 'https';
react.des = 'desct';
rect.price = 12

函数

一般结构： ‘函数名称’ = ‘（函数参数）’ => ‘函数具体实现’

例子1

//函数名为_keyExtractor，参数为item,index，实现为直接返回index
_keyExtractor = (item, index) => index;

例子2

  // 下拉刷新(没有参数及返回的函数)
    _renderRefresh = () => {
      this.setState({refreshing: true}) // 开始刷新
      // 这里模拟请求网络，拿到数据，3s后停止刷新
      setTimeout(() => {
          // TODO 提示没有可刷新的内容！
          this.setState({refreshing: false});
      }, 3000);
  };

例子3

_renderHeader = () => {
      return this.state.refreshing ? null : <View style={{flex:1,height:40,justifyContent:'center',alignItems:'center'}}><Text>{this.header}</Text></View>;
  };

参数传递 ...操作符

//例子1：
function foo(a, b, c, ...others){
    return others;
}
foo(1,2,3,4,5,6);//[4,5,6];
foo(1,2,3);//[];
foo();//[];

//例子2
let a = [0, 1, 2];
let [x, ...xs] = a;
// x = 0
// xs = [1, 2]              
[y, ...ys = [0]; // y = 0, ys = []
[z, ...zs] = []; // z = undefined, zs = []

//例子3
let [ x, y, ...rest ] = ['a', 'b', 'c','d'];
//x='a', y='b', rest=['c','d']

class 自定义定义组件

例子1

export default class FetchDemo extends Component {
    //构造函数
    constructor(props){
        super(props);
    }
    //渲染视图
    render(){
        return (
          <View style={{flex:1}}>
          {this.renderFlatList()}
          </View>
        );
    }
}

//使用
import FetchDemo from './FetchDemo';

例子2

let FetchDemo = React.createClass({
    //构造函数
    constructor(props){
        super(props);
    }
    //渲染视图
    render(){
        return (
          <View style={{flex:1}}>
          {this.renderFlatList()}
          </View>
        );
    }
})

export 外部访问

例子1：方法范围

utils.js:

import React, { Component } from 'react';
import {
    Platform,
    View,
  } from 'react-native';
export function getStatu() {
  if (Platform.OS === 'ios') {
    return  <View style={{height: 10, backgroundColor: 'red'}} />
  }
  return null;
}
other.js

import {
  getStatu
} from '../common/utils'

例子2：数据

myData.js:

export default
 [
        {
            "rating": 4.6,
            "range": "150店通用",
        }
 ]

other.js:

//可以直接操作flatData
import flatData from '../data/myData'

例子3 导出多个

//test.js

let host = 'http://baidu.com'; 
let EVNType = {  
    Host_REPLACE: 0,  
    Host_PUSH: 1,  
    Host_RESET: 2,  
};  
let method = name() => num;

module.exports = {
    host,
    EVNType,
    method
}

//其他地方使用
import {
  host,
    EVNType,
    method
} from './test';

例子4 自定义组件/类

//testComponent.js
export default class testComponent extends Component{
    constructor(props){
        super(props);
    }
 }
//使用
import testComponent from './src/page/testComponent';