RN-Fetch简单使用及简单封装

啥也不说了直接记录代码吧

fetch('https://facebook.github.io/react-native/movies.json',{
            method:'GET',//如果为GET方式，则不要添加body，否则会出错    GET/POST
            header:{//请求头
            },
            // body:{//请求参数
            //     'key1':'value1',
            //     'key2':'value2'
            // }
        })
            .then((response) => response.json())//将数据转成json,也可以转成 response.text、response.html
            .then((responseJson) => {//获取转化后的数据responseJson、responseText、responseHtml
                /*return responseJson.movies; */

                console.log(responseJson);
            }).catch((error) => {
                console.log(error);
        });

所有的代码就这么多，比起iOS来少的不是一星半点啊，超级简单

当然啦，喜欢封装的自然少不了封装一下下，下面也仅仅是简单简单简单的封装了一小下而已

注释的也是很6的
FetchRequest

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    TouchableOpacity
} from 'react-native';

export default class FetchRequest extends Component {

    //定义接收请求地址，当然也可以添加请求参数
    //parames 尽量是{'key1':'value1'，'key2':'value2'}
    //static request(url,parames,callBackSuccess,callBackError){

    static request(url,loadCallBack,callBackSuccess,callBackError){

        //请求发送中回调,可以加一些loading效果
        loadCallBack();

        fetch(url,{
            method:'GET',//如果为GET方式，则不要添加body，否则会出错    GET/POST
            header:{//请求头
            },
            // body:parames//请求参数
        })
            .then((response) => response.json())//将数据转成json,也可以转成 response.text、response.html
            .then((responseJson) => {//获取转化后的数据responseJson、responseText、responseHtml
                /*return responseJson.movies; */
                //成功回调
                callBackSuccess(JSON.stringify(responseJson));//JSON.stringify()避免出现烦人的[object object]

            }).catch((error) => {
                //失败回调
                callBackError(error);
        });
    }
}

使用就更简单了

import Request from './FetchRequest'

request(){

        //调用封装起来的方法

        Request.request('https://facebook.github.io/react-native/movies.json',
            ()=>{
                console.log('请求发送中...')
            },
            (responseData)=>{
                this.requestSuccess(responseData);
            },
            (error)=>{
                this.requestError(error);
            })

    }