我的项目中有一个页面中用户次要有三个和后端交互的局部:
a. 上传头像校验胜利后返回图片链接
b. 依据定位经纬度向后盾获取地位信息并展现在编辑界面
c. 最初将a,b返回信息以及一些其余输出信息一起提交。

其中a,b两个接口都是须要在点击最初确认之前申请。
最简略的办法就是在a,b接口申请的时候将确认按钮置灰或loading。然而独自减少置灰的话用户可能会感到纳闷,减少显著的loading的话会影响到用户批改其余信息。

如何使用户无感这个步骤?

次要思路:1. 当用户点击提交的时候如果a,b有一个没执行完期待最初一个执行完后执行c。2. 当用户点击提交a,b都执行完间接执行c。

代码设计也比较简单:

1. c申请存在三个执行的机会   . 页面点击确认   . 点击确认a执行完结   . 点击确认b执行完结。2. 设置三个标志符: 点击确认后C, a申请执行完结后A, b申请执行完结后B3. c申请函数中减少判断,如果未点击确认或者a、b正在申请中则间接返回,否则执行申请函数

代码示例

let A, B, C;function a() {  A = true  try {    // ... 执行申请逻辑    c();  } catch(err) {    // 提醒谬误    C = false;  }  A = false}function B() {  B = true  try {    // ... 执行申请逻辑    c();  } catch(err) {    // 提醒谬误    C = false;  }  B = false}function submit() {  C = true;  c();}function c() {  if (B || C) return; // b,c正在申请中  if (!C)return;  // ... 执行申请  C = false;}