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# SQLite数据库
在客户端配置文件<configuration>节点下,添加: <connectionStrings> <add name="localdb" conn ...
- Linux环境设置IP及关闭防火墙
确认当前网络配置: [root@localhost ~]# nmcli -p dev ===================== Status of devices ================= ...
- C# TreeView 拖拽节点到另一个容器Panel中简单实现
C# TreeView 拖拽节点到另一个容器Panel中简单实现 用了这么久C#拖拽功能一直没有用到也就没用过,今天因为项目需要,领导特地给我简单讲解了下拖拽功能,真是的大师讲解一点通啊.特地写一篇博 ...
- C# 如何通过mailto标签和SMTP协议两种方式发送邮件
本文主要讲解如何通过如现mailto标签和SMTP协议两种方式发送邮件,下面就直入主题 方法一.通过mailto标签发送邮件 通过mailto不是正真意义上的发送邮件,它只是会自动调用我们本地默认的邮 ...
- [原]Jenkins(二十) jenkins再出发之Error: Opening Robot Framework log failed
错误缘由:使用plugin [public robot framework test results] 生成的HTML文件都无法正常打开. 解决方案: Connect on your jenkin ...
- 线程的条件Condiition
条件Condition相当于给锁造钥匙,但是这钥匙是一次性的.一个线程拿到钥匙进去,出来之后钥匙没有归还,而是没了. 如下代码: from threading import Thread, Condi ...
- vue+axios如何操作数据交互
参考: http://www.php.cn/js-tutorial-403543.html
- Spring-Boot构建多模块项目
Spring-Boot构建多模块项目 功能模块单独项目开发,可以将一个庞大的项目分解成多个小项目,便于细分开发 Maven多模块项目不能独立存在,必须有一个介质来包含. 1.创建一个Maven 项目, ...
- vue2.0 --- vuex (一)
之前做vue项目中没有使用vuex 一直使用vue-router 组件.路由一直的转换,烦不胜烦 今天研究一下vuex vuex是什么: vuex是专门为vue.js应用程序开发的状态管理模式. 解 ...
- iOS 弹出菜单UIMenuController的基本使用
UIMenuController,弹出菜单@implementation DragView{ CGPoint startLocation; CGFloat rotation;}-(inst ...