关于javascript:记一次项目中的一个提交等待校验的问题

我的项目中有一个页面中用户次要有三个和后端交互的局部:
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申请执行完结后B
3. 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;
}

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理