首页 > 解决方案 > JS中根据动态对象和值过滤数组

问题描述

我有一个包含不同对象列表的数组,我希望能够重复使用相同的函数来过滤同一数组中的不同对象和值。

我的阵列

cocktailList = [
  Object {
    "abv": "24",
    "alcoholic": "true",
    "strength": "medium",
    "type": Object {
      "key": 3,
      "label": "Medium",
      "value": "medium",
    ...,
    ...,
    },
  },
  Object {
    ...
  },
]

我正在调用一个函数来过滤传递 2 个参数的数组:

这是我的函数和调用者

const drinkTypeHandler = (field, value) => {       
    const selectedType = cocktailList.filter((cocktail) => cocktail.field === value);
    console.log(selectedType); 
}

onPress={() => drinkTypeHandler(item.field, item.value)}

该函数可以很好地获取“值”参数,但它没有使用我传递的“字段”参数。我试图将它作为动态参数传递如下,但仍然没有成功

cocktailList.filter((cocktail) => `cocktail.${field} === ${value}`)

如果我对字段值进行硬编码,它可以工作

i.e.
cocktailList.filter((cocktail) => cocktail.type.value === value)

标签: javascriptarraysreactjsobjectarray-filter

解决方案


要使用动态字段名称,您必须使用方括号。所以你会使用:

cocktailList.filter((cocktail) => cocktail[field] === value)

您将遇到的问题是嵌套的键/值对,type因为您不能使用类似type.value的符号。


推荐阅读