在VueJS过滤器组件中编写Switch语句的更好选择？

Question

我有一个创建的Vue组件，它可以进行简单的过滤。我正在使用BootstrapVue。

我的问题是，我知道由于调试困难和嵌套错误，并非总是建议在JavaScript中使用Switch语句，但是看起来像这样的更好的替代方法是什么？

 computed: {
    products() {
      switch (this.selectedFilter) {
        case "all": {
          let products = [];
          let min = 0;
          for (let i = 0; i < productItems.length - 1; i++) {
            min = i;
            for (let j = i + 1; j < productItems.length; j++) {
              if (productItems[j].order < productItems[min].order) {
                min = j;
              }
            }
            let temp = productItems[min];
            productItems[min] = productItems[i];
            productItems[i] = temp;
          }
          productItems.forEach(product => {
            products.push(product);
          });
          return products;
        }
        case "subscriptions": {
          let products = [];
          productItems.forEach(product => {
            if (product.type == "recurring") {
              products.push(product);
            }
          });
          return products;
        }
        case "onetime": {
          let products = [];
          productItems.forEach(product => {
            if (product.type == "onetime") {
              products.push(product);
            }
          });
          return products;
        }
        case "purchased": {
          let products = [];
          productItems.forEach(product => {
            if (product.purchased) {
              products.push(product);
            }
          });
          return products;
        }
        case "unpurchased": {
          let products = [];
          productItems.forEach(product => {
            if (!product.purchased) {
              products.push(product);
            }
          });
          return products;
        }
        default:
          return "Product";
      }
    }
  },
  data() {...}

Answer 1

在您所显示的上下文中，

使用switch语句非常有用，这一点没错。可能需要做的工作是将结果转换为可用的格式。

使用Array.prototype.sort()和Array.prototype.sort()将使您受益匪浅：

Array.prototype.filter()

顺便说一句，从函数中返回一致的数据类型是一种很好的做法，在这种情况下为数组，因此在默认情况下已更改。如果需要在没有项目时显示占位符，则可以在模板声明中进行处理。