Question

我有一个函数myFn（），当if-else块中的某些特定条件为真时，需要执行以下函数：

if (title === "titleOne") {self.loadingBarOne = true };
if (title === "titleTwo") { self.loadingBarTwo = true };

var myFn = (//this contains the function logic to download a file)

self.loadingBarOne = false;
self.loadingBarTwo = false;

用户单击下载后，loadingBars将显示在UI中。如何在myFn（）运行时（即正在下载文件时）将loadingBarOne和loadingBarTwo的值设置为true，即在下载文件后将其设置为false？

如果用户同时单击两个下载，则myFn（）函数应同时运行，并在下载相应文件后将其设置为false。

Answer 1

我将使用您的myFn()作为回调函数来解决这个问题。您可以通过将加载栏保存到局部变量来重构对myFn()的实际调用，从而使该示例仅发生一次并使用局部变量。

var myFn = function (filename, callback) {
    // do your file downloading
    console.log('Downloading ', filename);
    callback();
};

if (title === "titleOne") {
    self.loadingBarOne = true;
    myFn('abc.html', function(resp){
        self.loadingBarOne = false;
    });    
} else if (title === "titleTwo") { 
    self.loadingBarTwo = true;
    myFn('abc.html', function(resp){
        self.loadingBarTwo = false;
    });
}

Answer 2

您可以使用JavaScript Promises。

var myFn= async (//this contains the function logic to download a file)
new Promise((resolve,reject)=>{
    self.loadingBarOne = true 
    self.loadingBarTwo = true
    resolve()
})
.then(()=>{
    return myFn()
})
.then(()=>{
    self.loadingBarOne = false 
    self.loadingBarTwo = false
})

Answer 3

您可以使用回调：

function myFn(callback) {
  //this contains the function logic to download a file
  callback();
}

if (title === "titleOne") {
  self.loadingBarOne = true;
  myFn(() => self.loadingBarOne = false);
}
if (title === "titleTwo") {
  self.loadingBarTwo = true;
  myFn(() => self.loadingBarTwo = false);
}

更好

function myFn() {
  return new Promise(resolve => {
    //this contains the function logic to download a file
    resolve();
  });
}

if (title === "titleOne") {
  self.loadingBarOne = true;
  myFn().then(() => self.loadingBarOne = false);
}
if (title === "titleTwo") {
  self.loadingBarTwo = true;
  myFn().then(() => self.loadingBarTwo = false);
}

Answer 4

我认为您需要的是

let self.loadingBarOne = false;
let self.loadingBarTwo = false;

let myFn = () => {
    if(title === "titleOne") {
        self.loadingBarOne = true; //this will set the global variable 
        //that we declared before to true
       }
    else if (title === "titleTwo") {
        self.loadingBarTwo = true;
    }

    //logic to download here

    //once that is done set global variable to false
    self.loadingBarOne = false;
    self.loadingBarTwo = false;

   }

您也可以承诺做同样的事情。保证变量保持为真，并在完成下载后解析并设置为false。

请记住，一般来讲全局变量不是最佳实践，但我假设您知道该做什么和不该做什么。如果您还将可变项的范围更改为不全局，那么您仍然可以使用我在那里的逻辑做同样的事情。

Answer 5

使用全局变量。

在您的函数中检查全局变量

如何在条件if-else语句上执行函数？

5 个答案: