Question

我正在创建一个面板，并且有内存，CPU和HDD的统计信息。我使用了switch语句，并且在case方法中，我正在使用CPU，内存和硬盘驱动器。

然而，问题在于我使用的是运营商而我不知道要使用哪个运营商，因为我已经尝试了所有这些运营商而且我没有得到我的结果预期

＆＃13;

                    switch(true){
                        case (mem_percent_get <= 0.01):
                            var mem_progress_color = 'progress-bar-primary';
                            break;
                        case (mem_percent_get <= 33):
                            var mem_progress_color = 'progress-bar-success';
                            break;
                        case (mem_percent_get <= 66):
                            var mem_progress_color = 'progress-bar-warning';
                            break;
                        case (mem_percent_get <=  80):
                            var mem_progress_color = 'progress-bar-danger';
                            break;
                         default:
                            mem_progress_color = 'progress-bar-theme';
                           
                           
                    }
                   
                    switch(true){
                        case (cpu_percent_get <= 33):
                            var cpu_progress_color = 'progress-bar-success';
                            break;
                        case (cpu_percent_get <= 66):
                            var cpu_progress_color = 'progress-bar-warning';
                            break;
                        case (cpu_percent_get <= 80):
                            var cpu_progress_color = 'progress-bar-danger';
                            break;
                         default:
                            cpu_progress_color = 'progress-bar-primary';
                           
                           
                    }
                   
                    switch(true){
                        case hdd_percent_get <= 0.01:
                            var hdd_progress_color = 'progress-bar-primary';
                            break;
                        case hdd_percent_get <= 30:
                            var hdd_progress_color = 'progress-bar-success';
                            break;
                        case hdd_percent_get <= 60:
                            var hdd_progress_color = 'progress-bar-warning';
                            break;
                        case hdd_percent_get <= 80:
                            var hdd_progress_color = 'progress-bar-danger';
                            break;
                         default:
                            hdd_progress_color = 'progress-bar-theme';
                    }

＆＃13;

Answer 1

好吧，我的第一个评论是在这种情况下不使用switch。你在做什么基本上是if () { } else if() {}块。如果您有要严格检查的值，则应使用switch。我建议查看switch的MDN文档。

其次，从我可以收集到的是，对于记忆，当值为1696/2098（80.83％）时，你需要它为红色。所有if / elseif案例都依赖于<=，这意味着该值必须小于或等于等式右边的数字。在你的情况下，你正在寻找<= 80，而没有看到你如何计算mem_percent_get（如果它在pastebin中，我无法在我当前的网络上打开它），你是有价值的可能在80以上。

对于您的危险，您可能希望80-100 +％为红色，因此您应该使用>=或大于或等于运算符。

MDN在comparison operators上拥有出色的资源。

Answer 2

创建一个接受百分比的getClassName方法，并返回一个className：

const getClassName = percent => {

  switch(true){
      case (percent <= 0.01):
          return 'progress-bar-primary';
      case (percent <= 33):
          return 'progress-bar-success';
      case (percent <= 66):
          return 'progress-bar-warning';
      case (percent <=  80):
          return 'progress-bar-danger';
      default:
          return 'progress-bar-theme';
  }

}

console.log('0: ', getClassName(0));
console.log('40: ', getClassName(40));
console.log('50: ', getClassName(50));
console.log('80: ', getClassName(80));
console.log('100: ', getClassName(100));

交换机案例中的Javascript运算符

2 个答案: