首页 > 解决方案 > 过滤对象数组,其中字段不完整

问题描述

我有以下数组

[
  {
    "id": 1,
    "name": "Ruan Duarte",
    "idade": 11,
    "work": {
      "id": 2,
      "name": "React"
    }
  },
  {
    "id": 2,
    "name": "Raul Dias",
    "idade": 13
  },
  {
    "id": 7,
    "name": "Caio Ribeiro",
    "idade": 60,
    "work": {
      "id": 4,
      "name": "Rails"
    }
  },
  {
    "id": 3,
    "name": "Felipe Lima",
    "idade": 55
  },
  {
    "id": 4,
    "name": "Camila",
    "idade": 25,
    "work": {
      "id": 3,
      "name": "Phyton"
    }
  }
]

我有一个这种格式的数组,其中某些角落的 work.name 字段为空。我尝试按如下方式进行过滤...

array.filter((i) => {
  return (
    i.work.name.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "")
      .includes(search.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""))
  )
})

记住我有一个要搜索的输入,并且在状态下它的值是用搜索设置的;

但是我收到一个错误,因为该字段未填写

标签: javascriptreactjsreact-native

解决方案


filter您可以在回调中添加对象值的验证。

这里,i?.work = i ? i.work : undefined

const array = [
  {
    "id": 1,
    "name": "Ruan Duarte",
    "idade": 11,
    "work": {
      "id": 2,
      "name": "React"
    }
  },
  {
    "id": 2,
    "name": "Raul Dias",
    "idade": 13
  },
  {
    "id": 7,
    "name": "Caio Ribeiro",
    "idade": 60,
    "work": {
      "id": 4,
      "name": "Rails"
    }
  },
  {
    "id": 3,
    "name": "Felipe Lima",
    "idade": 55
  },
  {
    "id": 4,
    "name": "Camila",
    "idade": 25,
    "work": {
      "id": 3,
      "name": "Phyton"
    }
  }
]

const search = 'Phy';
console.log(array.filter((i) => {
  return (
    i?.work?.name?.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "")
      .includes(search.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""))
  )
}));


推荐阅读