Open AnnVoV opened 6 years ago
一般我们的后台页面中会存在多个表单项,我们在保存前会对this.$refs.form这个数组做一次validate
我们后台用了element-ui, 表单验证的validate 是个异步方法,那么我们怎么样等到所有表单验证完了再走下一步?很明显我们想到用Promise.all 所以我们可以把async 和 promise.all 结合起来用
... async validate() { // 返回一个PromiseArray const promiseArray = this.$refs.form.map((form) => { return form.validate(); }); // 这里直接返回一个Promise.all return await Promise.all(promiseArray); } // 【注】其实直接使用promise.all 也可以,在此场景下没必要使用async await。。。 submit() { this.validate() .then(() => { // 提交数据 }) .catch((err) => { // 只要有一个表单验证不通过,就会被catch }) }
推荐阅读: 深入理解ES6 Async Functions (异步函数) https://zhuanlan.zhihu.com/p/30688707
背景
一般我们的后台页面中会存在多个表单项,我们在保存前会对this.$refs.form这个数组做一次validate
已知
我们后台用了element-ui, 表单验证的validate 是个异步方法,那么我们怎么样等到所有表单验证完了再走下一步?很明显我们想到用Promise.all 所以我们可以把async 和 promise.all 结合起来用
结果
推荐阅读: 深入理解ES6 Async Functions (异步函数) https://zhuanlan.zhihu.com/p/30688707