fetch 封装
fetch.js
var http = {
get: function (url) {
return new Promise((resolve, reject) => {
fetch(url)
.then(res => res.json())
.then(data => resolve(data))
.catch(err => reject(err))
})
},
post: function (url, data) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'POST',
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(data)
})
.then(res => res.json())
.then(json => resolve(JSON.parse(json.d)))
.catch(err => reject(err))
})
},
put: function (url, data) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'PUT',
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(data)
})
.then(res => res.json())
.then(data => resolve(data))
.catch(err => reject(err))
})
},
delete: function (url, data) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'DELETE',
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(data)
})
.then(res => res.json())
.then(data => resolve('删除成功'))
.catch(err => reject(err))
})
}
}
调用方式:
var url = 'http://xx.asmx/xx';
var param = {
xx: xx,
xx: xx,
};
http.post(url, param)
.then(data => console.log(data.msgs))
.catch(err => console.log(err))
//.catch(err => console.log(请求失败))
https://blog.csdn.net/qq_40190624/article/details/82873640
https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
fetch 封装的更多相关文章
- 用ES6和fetch封装网络请求
导读: fetch: 这个方法是ES2017中新增的特性,这个特性出来后给人一种传统ajax已死的感觉,其实它的作用是替代浏览器原生的XMLHttpRequest异步请求,我们在日常的开发中,基本不会 ...
- fetch封装
import {fetch as fetchPro} from "whatwg-fetch" import qs from "qs" const get=(ur ...
- fetch知识点汇总
使用XHR发送一个json请求一般是这样: const xhr = new XMLHttpRequest() xhr.open('Get', url) xhr.responseType = 'json ...
- Jquery ajax, Axios, Fetch区别之我见(转载)
来源:https://segmentfault.com/a/1190000012836882 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被 ...
- fetch 代替 XMLHttpRequest (json-server 模拟后台接口)
一.fetch 是 XMLHttpRequest 的替代方案.说白了就是除了 ajax 获取后台数据之外也可以用fetch 来获取. 二.fetch 的支持性还不是很好.挂载于BOM中可以通过浏览器直 ...
- 原生 js 封装get ,post, delete 请求
现在的项目中都在用VUE 以及react 等MVC, MVVM 框架. 丢弃了原始的JQ .不可能为了个$.ajax();而把JQ引进来吧. 在vue1的开发中 提供了 vueResouce, vu ...
- fetch 函数分装
1.fetch /** * 封装 fetch */ import { hashHistory } from 'react-router'; export default function reques ...
- React Native 开发豆瓣评分(四)集中管理 fetch 数据请求
豆瓣评分的API接口 接口是从网上查找的,看样子应该是微信小程序里面扣出来的(ua 里面有 wechatdevtools) 接口都需要设置apiKey(054022eaeae0b00e0fc068c0 ...
- vue-d2admin-axios异步请求登录,先对比一下Jquery ajax, Axios, Fetch区别
先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...
随机推荐
- sql中--行处理数据的两种方式
--创建待使用的表格CREATE TABLE Orders ( OrderID INT , CostValue DECIMAL(18, 2) );WITH cte_temp AS ( SELECT 1 ...
- Python3基础笔记--生成器
目录: 一.列表生成器 二.生成器 三.迭代器 一.列表生成器 a = [x for x in range(10)] b= [y*2 for y in range(10)] def f(n) retu ...
- sys.path
sys.path.append() 和 sys.path.insert() python程序中使用 import XXX 时,python解析器会在当前目录.已安装和第三方模块中搜索 xxx,如果都搜 ...
- BZOJ 4373算术天才⑨与等差数列(线段树)
题意:给你一个长度为n的序列,有m个操作,写一个程序支持以下两个操作: 1. 修改一个值 2. 给出三个数l,r,k, 询问:如果把区间[l,r]的数从小到大排序,能否形成公差为k的等差数列. n,m ...
- 第一章、zabbix安装
前言: 注意:本文不涉及性能测试.性能优化中的监控,所有文字的出发点都是日常运维监控. 在开始之前,我们还是先统一下认识:要监控一个对象,需要掌握哪些东西呢? 监控对象的理解:要监控的对象你是否了解呢 ...
- php异常处理的深入
引出 如果你调一个类,调用时数据验证时报了个错,你会以什么方式返回 数组,布尔值? 数组这个可以带错误原因回来,那布尔值呢? 返回了个 false, 报错时把错误放在类变量里?还是专门用一个获取错误的 ...
- subline Text3 插件安装
--没有解决,换了vscode 安装Package Control 这是必须的步骤,安装任何插件之前需要安装这个 自动安装的方法最方便,只需要在控制台(不是win的控制台,而是subline 的)里粘 ...
- Object-C,四则运算计算器
下面是是一个比较复杂的类. 定义一个四则运算计算器Caculator的接口和实现. 在main函数中,让用户输入四则运算表达式,比如a+b,a-b. 最后,在控制台输出结果. 用到的语法:接口.类的定 ...
- 题解 P2330 【[SCOI2005]繁忙的都市】
又是一道Kruskal题目. AC代码见下. 主要思路就是将所有的边储存起来,然后进行贪心地选择,期间需要判断两个端点是否有关联,这一过程通过并查集实现.Kruskal部分套模板就可以了. #incl ...
- 【Henu ACM Round#20 B】Contest
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 根据时间和原分数. 算出对应的分数就可以了. [代码] #include <bits/stdc++.h> using n ...