Javascript 有没有办法刷新滑块输入上的过滤器数据？

我有一个包含产品模型的数据集，我想制作一个过滤器，用一个范围滑块过滤它们。当我希望数据集在滑块输入上刷新时，数据集将减少到0

这是一个细分：我有如下数据：

const stratPickups = {
    "Model 1": {
        name: "Clean Model",
        design: "Single Coil",
        output: 4,
        look: "traditional"
    },
    "Model 2": {
        name: "Balanced Model",
        design: "Single Coil",
        output: 5,
        look: "traditional"
    },
    "Model 3": {
        name: "Balanced Model 2",
        design: "Single Coil",
        output: 6,
        look: "traditional"
    },
    "Model 4": {
        name: "High Output Model",
        design: "Single Coil",
        output: 8,
        look: "traditional"
    },
}

if (e.target.value === "strat") {
      data = Object.values(stratPickups);
      refreshView();

我还有一个更改事件，它加载如下数据：

const stratPickups = {
    "Model 1": {
        name: "Clean Model",
        design: "Single Coil",
        output: 4,
        look: "traditional"
    },
    "Model 2": {
        name: "Balanced Model",
        design: "Single Coil",
        output: 5,
        look: "traditional"
    },
    "Model 3": {
        name: "Balanced Model 2",
        design: "Single Coil",
        output: 6,
        look: "traditional"
    },
    "Model 4": {
        name: "High Output Model",
        design: "Single Coil",
        output: 8,
        look: "traditional"
    },
}

if (e.target.value === "strat") {
      data = Object.values(stratPickups);
      refreshView();

调用函数

refreshView（）

，该函数在屏幕上填充“卡片”，如下所示：

问题： 上述方法有效，但它将我的数据减少到0，因为它过滤掉了不匹配的结果。是否有办法将数据“刷新”回其正常状态，以便原始数据集保持完整

Codepen 如果你想玩它，这里有一个密码笔。说明：从第二个下拉菜单中选择“Stratocaster pickups”以加载Stratocaster pickups数据

---

有两个变量可将选定值存储在下拉列表和滑块中。无论在何处进行筛选，都要考虑这两个变量的值。

代码似乎会对

数据

变量进行变异<代码>数据是代码中使用的状态。如果在滑块更改期间发生更改，

数据

的值需要恢复到完整列表中

---

或者，不要变异全局状态变量

数据

。创建另一个名为

Filteredata

的变量，它可以是一个瞬态，并在

refreshView

中使用它。因此，我对如何在

refreshView（）中使用变量
Filteredata
感到困惑。因为
refreshView（）
接受
数据
变量来构建卡。你将如何处理这个问题？谢谢你的帮助。事实上，我知道了！我将函数更改为
refreshView（dataSet）
以传入数据集。谢谢你的帮助！能否将
filteredData
作为参数传递给
refreshView（）
函数？