Vue:Promise概要
1、Promise中then是异步的
2、Promise 的then里面两个回调,默认第一个resolve,第二个reject;不会进入catch;如果只有一个回调则进入catch
var p1=new Promise((resolve,rej) => {
console.log('没有resolve')
//throw new Error('直接throw错误,替代reject') 或者 reject(new Error(/*Error*/));
rej('失败了') })
//then里面两个回调,默认第一个resolve,第二个reject;不会进入catch;如果只有一个回调则进入catch
p1.then(data =>{
console.log('data::',data);
},err=> {
console.log('err::',err)
}).catch(
res => {
console.log('catch data::', res)
})
//输出:
//没有resolve
//err:: 失败了
3、链式传值
/*例1.使用Promise.resolve()启动*/
let task1 = (value1)=>value1+;
let task2 = (value2)=>value2+;
let task3 = (value3)=>{console.log(value3+)}; Promise.resolve().then(task1).then(task2).then(task3);//console => 7 //如果需要resolve()往后传递多个参数,不能直接写resolve(a1,a2,a3),这样只能拿到第一个要传的参数,需要以数组或对象去传递
let obj = {a1:a1,a2:a2,a3:a3};
resolve(obj)
//or
let arr =[a1,a2,a3];
resolve(arr);
4、链式调用函数
then方法提供一个供自定义的回调函数,若传入非函数,则会忽略当前then方法。
回调函数中会把上一个then中返回的值当做参数值供当前then方法调用。
then方法执行完毕后需要返回一个新的值给下一个then调用(没有返回值默认使用undefined)。
每个then只可能使用前一个then的返回值。
let func = function() {
return new Promise((resolve, reject) => {
resolve('旧值');
});
}; let nb = function() {
return '新值';
} //1、输出:新值
func().then(function () {
return nb();
}).then(resp => {
console.warn(resp);
console.warn('1 =========<');
}); //then 后回调里面的内容,没有返回值,所以undefine
//2、输出:undefine
func().then(function () {
nb();
}).then(resp => {
console.warn(resp);
console.warn('2 =========<');
}); //如果 onFulfilled 不是函数,其必须被忽略
//如果 onFulfilled 是函数: //这里注意cb()的返回值不是函数,所以会被忽略,而输出上一个then的返回值 //3、输出:旧值
func().then(cb()).then(resp => {
console.warn(resp);
console.warn('3 =========<');
}); //cb是识别为函数
//4、输出:新值
func().then(cb).then(resp => {
console.warn(resp);
console.warn('4 =========<');
});
资源:
https://segmentfault.com/a/1190000010420744?utm_source=tag-newest
Vue:Promise概要的更多相关文章
- vue安装概要以及vue测试工具
一.概述 1.安装node,去node官网 2.新建一个项目,通过npm init命令初始化,即创建一个package.json文件 3.用命令 npm install vue -g 全局安装vue( ...
- vue:概要
一.环境 #安装nodejs-官网安装包配置环境变量 node -v #安装webpack npm install webpack -g #安装vue-cli npm install vue-cli ...
- vue语法概要二
函数 用途 类别 v-html 用于输出html格式的数据 输出 v-bing 用于输出值 输出 v-model 双向绑定 输入和输出 v-if 逻辑判断 分支语句 v-else 同上 分支语句 v- ...
- Vue.js 很好,但会比 Angular 或 React 更好吗?
文章转自:http://www.oschina.net/translate/vuejs-is-good-but-is-it-better-than-angular-or-rea Vue.js 是一个用 ...
- Vue iview Tree组件实现文件目录-基础实现
注册页面路由 router/router.js { path: 'folder_tree', name: 'folderTree', component: () => import('@/vie ...
- Vue2开发大全
参考资料: vuex element qs.js axios.js vue promise 关于ES6的Promise的使用深入理解 vue2 设置网页title的问题 Mint UI websto ...
- 一些自己常用的cdn
1.vue <script src="http://cdn.bootcss.com/vue/1.0.28-csp/vue.js"></script> < ...
- 简述前后端项目RSA+AES加解密
一.登录机制 在项目中,我们可以大致得出一个登录的过程,主要分为 登录验证.登录保持.退出三个部分.登录验证是指客户端提供用户名和密码,向服务器提出登录请求,服务器判断客户端是否可以登录并向客户端确 ...
- 速查列表:Apache SkyWalking OAL 的 域(Scopes)
OAL简介 在流模式(Streaming mode)下,SkyWalking 提供了 观测分析语言(Observability Analysis Language,OAL) 来分析流入的数据. OAL ...
随机推荐
- C语言 · 8皇后问题改编
8皇后问题(改编) 问题描述 规则同8皇后问题,但是棋盘上每格都有一个数字,要求八皇后所在格子数字之和最大. 输入格式 一个8*8的棋盘. 输出格式 所能得到的最大数字和 样例输入 1 2 3 4 5 ...
- 匿名函数gc分析
测试一:使用member function创建action会产生gc,不管该函数是否访问外部变量: private System.Action memberAct = null; // gc 112B ...
- ubuntu 使用旧式Gnome风格的菜单
sudo apt-add-repository ppa:diesch/testing sudo apt-get update sudo apt-get install classicmenu-indi ...
- 【转】Flask入门之上传文件到服务器
#Sample.py # coding:utf-8 from flask import Flask,render_template,request,redirect,url_for from werk ...
- Http url MVC Request Query Form 传参专贴
一.工具区 [参考]postman中 form-data.x-www-form-urlencoded.raw.binary的区别--转 二..net MVC 三..net WebForm 四.Java ...
- A real example of vioplot in R (sample data and code attached)
Basic information Package name: vioplot Package homepage: https://cran.r-project.org/web/packages/vi ...
- kafka---->kafka stream的使用(一)
kafka stream的简单使用,这里是官方文档上面的例子. kafka的简单使用 一.启动Kafka server huhx@gohuhx:~/server/kafka_2.11-1.1.0$ b ...
- LeetCode - 498. Diagonal Traverse
Given a matrix of M x N elements (M rows, N columns), return all elements of the matrix in diagonal ...
- Gym 100712
我的作用:增加罚时. noip380分大佬全程带飞出了10T,可惜被我搞的罚时太高了... 那啥,你会发现java代码有两种风格,嗯两个人,c++自然就是自招大佬了... A:大水题略 B:(不是我写 ...
- Butterknife 导入项目配置
在app的 build.gradle 文件中添加 dependencies { // Butterknifeapi 'com.jakewharton:butterknife:8.6.0'annotat ...