promise封装ajax
promise的含义(本身不是异步,是封装异步操作的容器,统一异步的标准)
promise对象的特点:对象的状态不受外界影响;一旦状态改变,就不会再变,任何时候都可以得到这个结果。
function aaa() {
const promise = new Promise(function (resolve, reject) {
const xmlhttp = new XMLHttpRequest();
xmlhttp.open("post", "url");
xmlhttp.setRequestHeader("content-type", "application/x-www-form-urlencoded");
xmlhttp.onreadystatechange = function () {
if (this.readyState != 4) {
return;
}
if (this.status == 200) {
resolve(this.response);
} else {
reject(new Error("数据请求失败"))
}
}
xmlhttp.send(""); })
return promise;
}
//then处理数据
let bbb = aaa();
bbb.then(function (value) {
var data = JSON.parse(value);
for (let i of Object.values(data)) {
var name = i.name_coach;
document.getElementById("ul").innerHTML += "<li>" + name + "</li>";
}
}, function (error) {
alert(error);
})
promise封装ajax的更多相关文章
- Promise 封装 ajax
Promise 封装ajax 成链式结构: var url = 'http'; function(method, url) { return new Promise(function(res, ret ...
- 用promise封装ajax
首先贴代码 var ajaxOptions = { url: 'url', method: 'GET', async: true, data: null, dataType: 'text', } fu ...
- 使用promise封装ajax
直接上代码: function Ajax(method, headers, url, data, progress = null) { return new Promise(function (res ...
- vue实践---vue结合 promise 封装原生ajax
有时候不想使用axios这样的外部依赖,想自己封装ajax,这里有两种方法 方法一,在单个页面内使用 封装的代码如下: beforeCreate () { this.$http = (() => ...
- 简单的基于promise的ajax封装
基于promise的ajax封装 //调用方式: /* ajaxPrmomise({ url:, method:, headers:{} }).then(res=>{}) */ ;(functi ...
- React Native 网络请求封装:使用Promise封装fetch请求
最近公司使用React作为前端框架,使用了异步请求访问,这里做下总结: React Native中虽然也内置了XMLHttpRequest 网络请求API(也就是俗称的ajax),但XMLHttpRe ...
- 微信小程序ES6方法Promise封装接口
为何要封装接口? 有小程序开发的经验者,相信对微信API Request很熟悉了.对接接口时,有大部分的开发者都是直接调用request方法,去请求后台接口并渲染数据.诚然,直接使用api发起请求对接 ...
- jsonp的原理介绍及Promise封装
什么叫jsonp? jsonp是json with padding(填充式json或参数式json)的简写,是通过ajax请求跨域接口,获取数据的新实现方式 jsonp的实现原理: 动态创建scrip ...
- vue axios接口封装、Promise封装、简单的axios方法封装、vue接口方法封装、vue post、get、patch、put方法封装
相信大家在做前后端数据交互的时候都会给请求做一些简单的封装就像之前封装ajax方法一样axios的封装也是一样的简单下面这个就是封装的axios的方法,require.js import axios ...
随机推荐
- SVM-支持向量机(二)非线性SVM分类
非线性SVM分类 尽管SVM分类器非常高效,并且在很多场景下都非常实用.但是很多数据集并不是可以线性可分的.一个处理非线性数据集的方法是增加更多的特征,例如多项式特征.在某些情况下,这样可以让数据集变 ...
- 牛客CSP-S提高组赛前集训营5 赛后总结
A.无形的博弈 心理题. 答案为\(2^n\),可感性理解结论的正确性. #include<bits/stdc++.h> #define LL long long const LL Mod ...
- windows10(家庭版)+ laradock 安装踩坑记一记
Docker 安装: 首先我们需要在系统安装 Docker 的免费社区版,官方提供 Windows.Mac 及 Linux 等版本下载:下载地址.下载操作系统对应版本后,按照引导流程安装,最后打开 D ...
- Gin_渲染
1. 各种数据响应格式 package main import ( "github.com/gin-gonic/gin" "github.com/gin-gonic/gi ...
- vue配置开发,测试,生产环境api
npm run build 调用开发环境接口,打包开发环境npm run build:test 调用测试环境接口,打包测试环境npm run build:prod 调用生产环境接口,打包生产环境 vu ...
- Oracle - 拼接多个字段 - wm_concat()函数
Oracle wm_concat()函数oracle wm_concat(column)函数使我们经常会使用到的,下面就教您如何使用oraclewm_concat(column)函数实现字段合并如:s ...
- chrome查看js报错Uncaught SyntaxError: Unexpected string
个人博客原文http://wenhaofan.com/article/20180912123136 js报错,最后发现是$(function(){})这部分()不完整 $(function({ $(& ...
- SpringBoot学习- 3、整合MyBatis
SpringBoot学习足迹 1.下载安装一个Mysql数据库及管理工具,同类工具很多,随便找一个都可以,我在windows下做测试项目习惯使用的是haosql 它内部集成了MySql-Front管理 ...
- 01 : Java入门
Java概述 Java之父·詹姆斯·高斯林(James Gosling) 1977年获得了加拿大卡尔加里大学计算机科学学士学位,1983年获得了美国卡内基梅隆大学计算机科学博士学位,毕业后到IBM工作 ...
- 杭电oj1717——小数化分数(java实现)
question:小数化分数2 思路: /** * 这道题没有整数部分(有也无所谓,算小数部分,算完了分子分母按倍数加上就好),也就是说数组直接从a[2]开始后面是小数,我把这道题分为了三类: * * ...