React Native 网络请求

如下面的Code，分别介绍了GET，POST，以及使用XMLHttpRequest的Get请求。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97

import React, { Component } from 'react'; import { AppRegistry,   StyleSheet,   Text,   View,   Image,   TouchableOpacity,   TouchableHighlight,   ToastAndroid,   Alert, } from 'react-native';   var BASE_URL = 'https://m.baidu.com';   class AlignItemsBasics extends Component {        getEvent() {          fetch('https://m.baidu.com' )              .then((response) => response.text())              .then((responseText) => {                ToastAndroid.show(responseText, ToastAndroid.SHORT);                console.warn(new Date().getMilliseconds());              })              .catch((error) => {                console.warn(error);              }).done();        }        getByXMLHttpRequest(){          var request = new XMLHttpRequest();          request.onreadystatechange = (e) => {              if(request.readyState !== 4){                  return;              }              if(request.status === 200){                  ToastAndroid.show('success' + request.responseText, ToastAndroid.SHORT);              }else{                  ToastAndroid.show('error', ToastAndroid.SHORT);              }          };          request.open('GET','http://xxx/xxx');          request.send();      }         postSource(){          fetch('https://m.baidu.com' ) //          .then((response) => response.text())          .then((responseText) => {              // Works on both iOS and Android              Alert.alert(                '请求结果',                responseText.substring(0,100),                [                  {text: 'Ask me later', onPress: () => console.warn('Ask me later pressed')},                  {text: 'Cancel', onPress: () => console.warn('Cancel Pressed'), style: 'cancel'},                  {text: 'OK', onPress: () => console.warn('OK Pressed')},                ]              )          })          .catch((error) => {            console.warn(error);          }).done();        }        render() {          return (          < View  style={{flex:1, justifyContent:'center', alignItems:'center'}}>              < TouchableHighlight   onPress={this.getEvent} style={styles.button}>                    < Text >Get 请求</ Text >              </ TouchableHighlight >               < TouchableHighlight   onPress={this.getByXMLHttpRequest} style={styles.button}>                    < Text >使用XMLHttpRequest Get 请求</ Text >               </ TouchableHighlight >               < TouchableHighlight   onPress={this.postSource} style={styles.button}>                    < Text >Post 请求</ Text >               </ TouchableHighlight >          </ View >          );      }     };        var styles = StyleSheet.create({          button: {            width : 180,            height: 50,            justifyContent:'center',            backgroundColor: '#e2e2e2',            alignItems:'center',            margin: 10,          }      });   AppRegistry.registerComponent('AwesomeProject', () => AlignItemsBasics);

　　

本文转自Work Hard Work Smart博客园博客，原文链接：http://www.cnblogs.com/linlf03/p/5954160.html，如需转载请自行联系原作者