ES6 fetch函数与后台交互实现

最新推荐文章于 2024-08-25 19:06:28 发布

霜如明月

最新推荐文章于 2024-08-25 19:06:28 发布

阅读量1.4k

点赞数

分类专栏：前端文章标签： es6

本文链接：https://blog.csdn.net/q3254421/article/details/85331329

版权

这篇博客主要介绍了在react-native中如何使用ES6的fetch函数与后端进行交互，包括数据提交格式及获取JSON返回数据的方法。还提到了fetch作为HTTP请求的封装，与XMLHttpRequest的区别。

摘要由CSDN通过智能技术生成

最近在学习react-native,遇到调用后端接口的问题.看了看官方文档,推荐使用es6的fetch来与后端进行交互,在网上找了一些资料.在这里整理,方便以后查询.

1.RN官方文档中,可使用XMLHttpRequest

var request = new XMLHttpRequest();
request.onreadystatechange = (e) = >{
  if (request.readyState !== 4) {
    return;
  }
  if (request.status === 200) {
    console.log('success', request.responseText);
  } else {
    console.warn('error');
  }
};
request.open('GET', 'https://mywebsite.com/endpoint.php');
request.send();

这是http的原生方法,这里不做多的介绍.

2.RN官方文档中,推荐使用fetch

fetch('https://mywebsite.com/endpoint/', {
  method: 'POST',
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    firstParam: 'yourValue',
    secondParam: 'yourOtherValue',
  })
}).then(function(res) {　　console.log(res)
})