ReactJS фильтр, включая список массивов

Question

 {nDATA
          .filter((newData) => newData.titles.includes(props.currentFilter))
          .map((value, index) => (
    

Итак, в приведенном выше коде у меня есть nDATA, который является array из objects, который я фильтрую и отображаю.

Затем у меня также есть props.currentFilter, который является prop передается в этот компонент, который представляет собой список array, например

["Apples", "Oranges", "Strawberries", "Grapes"]

То, что я пытаюсь сделать, это настроить мой фильтр здесь, чтобы проверить каждый newData.titles для каждого из массивов в props.currentFilter. Таким образом, когда я ищу, скажем, Apples, Oranges и Grapes, он будет проверять каждую вещь для каждого из них, и если у него есть 1 из них, он проходит. Моя настройка прямо сейчас работает идеально, если я передаю только строку в include, выполняя props.currentFilter[0], но это не приносит мне пользы для того, что я пытаюсь сделать здесь. Я пытался протестировать несколько способов сделать это и изо всех сил пытался понять это, любая помощь будет очень признательна = D

Answer 1

Вы можете использовать .some() в своем методе фильтрации, чтобы проверить, включено ли какое-то значение из вашего props.currentFilter в ваш newData.titles массив:

nDATA
  .filter(newData => props.currentFilter.some(str => newData.titles.includes(str)))

Answer 2

Оптимальным способом запуска этой функции было бы преобразование массива currentFilter в объект с ключами, являющимися вашими словами фильтра. Значения могут быть любыми.

let filterObj = props.currentFilter.reduce((acc, cur) => {
 acc[cur] = 1
 return acc
}, {})

, который должен возвращать

filterObj = {
 "apples": 1,
 "oranges": 1,
 "bananas": 1,
}

Затем запустите свой фильтр l oop и вызовите метод hasOwnProperty, который возвращает логическое

{nDATA
          .filter((newData) => currentFilter.hasOwnProperty(newData.titles))
          .map((value, index) => (

Answer 3

nData.filter(newData => props.currentFilter.includes(newData.titles))