如下面的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 网络请求的更多相关文章

  1. 《React Native 精解与实战》书籍连载「React Native 网络请求与列表绑定」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

  2. React Native 网络请求封装:使用Promise封装fetch请求

    最近公司使用React作为前端框架,使用了异步请求访问,这里做下总结: React Native中虽然也内置了XMLHttpRequest 网络请求API(也就是俗称的ajax),但XMLHttpRe ...

  3. React Native网络请求

    很多移动应用都需要从远程地址中获取数据或资源.你可能需要给某个REST API发起POST请求以提交用户数据,又或者可能仅仅需要从某个服务器上获取一些静态内容--以下就是你会用到的东西.新手可以对照这 ...

  4. react native 网络get请求方式参数不可为undefined或null

    react native 网络get请求方式参数不可为undefined(为空的话默认变为)或null 错误写法: export function addToCartAction(isRefreshi ...

  5. React Native网络编程之Fetch

    目录 1.前言 2.什么是Fetch 3.最简单的应用 4.支持的请求参数 - 4.1. 参数详讲 - 4.2. 示例 5.请求错误与异常处理   1. 前言   网络请求是开发APP中不可或缺的一部 ...

  6. [RN] React Native Fetch请求设置超时

    一.实现思路 根据Promise.race的特性,我们在Promise.race里面添加两个任务,一个是正常的网络请求任务A,另外一个便是网络延时任务B,网络延时可以利用setTimeout方法实现. ...

  7. React Native之Fetch简单封装、获取网络状态

    1.Fetch的使用 fetch的使用非常简单,只需传入请求的url fetch('https://facebook.github.io/react-native/movies.json'); 当然是 ...

  8. 给所有开发者的React Native详细入门指南

    建议先下载好资料后,再阅读本文.demo代码和资料下载 目录 一.前言 二.回答一些问题 1.为什么写此教程 2.本文适合哪些人看 3.如何使用本教程 4.需要先学习JavaScript.HTML.C ...

  9. [书籍精读]《React Native精解与实战》精读笔记分享

    写在前面 书籍介绍:本书由架构师撰写,包含ReactNative框架底层原理,以及与iOS.Android混合开发案例,精选了大量实例代码,方便读者快速学习.主要内容分为两大部分,第1部分" ...

随机推荐

  1. c#缓存介绍(转)

    缓存主要是为了提高数据的读取速度.因为服务器和应用客户端之间存在着流量的瓶颈,所以读取大容量数据时,使用缓存来直接为客户端服务,可以减少客户端与服务器端的数据交互,从而大大提高程序的性能. 本章从缓存 ...

  2. 设置vim默认参数 例如设置默认背景颜色

    因个人喜好问题,本人使用vim的时候喜欢将背景颜色设为dark. 但是每次打开一个vim的时候都要重新设置一次,感觉非常麻烦. 总要输入[Esc] :set bg=dark很不方便 粗暴的办法是直接进 ...

  3. linux中模块的构建,传参,和printk函数的简单使用

    静态编译,动态加载应用想访问内核需要通过系统调用 驱动:1.模块(打包,加入内核)2.内核机制3.操作硬件 在Kconfig里面配置menuconfig的时候,不同的类型会在图形化界面的终端显示不用的 ...

  4. Maven基础知识(转)

    文章摘自http://www.cnblogs.com/xing901022/p/4170248.html 谢谢楼主的总结,界面设计的很好看! 一.什么是Maven Maven是一个用于项目构建的工具, ...

  5. C#常用操作类库四(File操作类)

    public class FileHelper : IDisposable { private bool _alreadyDispose = false; #region 构造函数 public Fi ...

  6. 关于调用deleteRowsAtIndexPaths withRowAnimation方法出现错误

    通常原因是因为 这个方法的调用与数据源有关. 检测1.你的数据源是否写死了. 2.调用该方法前你是否移除相关的数据源 相关的核心代码如下: - (NSInteger)tableView:(UITabl ...

  7. /date(-62135596800000)转换正常格式的时间

    function formatDatebox(value) { if (value == null || value == '') { return ''; } var dt = parseToDat ...

  8. 类和对象 nil/Nil/NULL的区别

    iOS-----类和对象,nil/Nil/NULL的区别   iOS中类和对象,nil/Nil/NULL的区别 类与对象的概念 类是对同一类事物高度的抽象,类中定义了这一类对象所应具有的静态属性(属性 ...

  9. IOS7.0 UILabel实现自适应高度的新方法

    //IOS7.0中利用- (CGRect)boundingRectWithSize:(CGSize)size options:(NSStringDrawingOptions)options attri ...

  10. 如何开启ubuntu的SSH服务

    buntu默认并没有安装ssh服务,如果通过ssh链接ubuntu,需要自己手动安装ssh-server,然而SSH分客户端openssh-client和服务端openssh-server,opens ...