首页 > 代码库 > React Native 网络请求
React Native 网络请求
如下面的Code,分别介绍了GET,POST,以及使用XMLHttpRequest的Get请求。
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);
React Native 网络请求
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。