JS滤波器阵列所有字段

Question

如何使该函数搜索数组中的所有字段，而不是时间上的单个变量？

const filteredData = tickets.filter(val => {
  if (inputText === '') {
    return val;
  } else {
    return val.ticket.ticketNumber.toLowerCase().includes(inputText);
    // return val.ticket.gallons.toLowerCase().includes(inputText);
  }
});

票证示例(单击以显示)

​

[
  {
    index: "-N-ecIthFAo6EaEe7BVT",
    ticket: {
      appName: "biolime",
      driver: "Walt",
      endUser: "Verhoff Farms",
      field: "Marston-North 40",
      gallons: "1,237,887",
      lagoon: "CAMP-3",
      lagoonMaterial: "Lime Slurry",
      source: "Campbell's Soup",
      ticketDate: "04-04-2022",
      ticketNumber: "5825",
      ticketTime: "7:26:49.484 am",
      truck: "",
      zone: "Zone B",
    },
  },
  {
    index: "-N17TZscKkfW0TYE84WZ",
    ticket: {
      appName: "biolime",
      driver: "Walt",
      endUser: "Rob Howell",
      field: "testing",
      gallons: "9,999",
      lagoon: "CAMP-3",
      lagoonMaterial: "Lime Slurry",
      source: "Campbell's Soup",
      ticketDate: "04-13-2022",
      ticketNumber: "5826",
      ticketTime: "4:35:44.252 pm",
      truck: "10",
      zone: "",
    },
  },
];

​

Answer 1

您不需要每次在过滤器回调中检查inputText === ''。

​

const ticket = [{
    "appName": "biolime",
    "driver": "Walt",
    "endUser": "Verhoff Farms",
    "field": "Marston-North 40",
    "gallons": "1,237,887",
    "lagoon": "CAMP-3",
    "lagoonMaterial": "Lime Slurry",
    "source": "Campbell's Soup",
    "ticketDate": "04-04-2022",
    "ticketNumber": "5825",
    "ticketTime": "7:26:49.484 am",
    "truck": "",
    "zone": "Zone B"
  },
  {
    "appName": "biolime",
    "driver": "Walt",
    "endUser": "Rob Howell",
    "field": "testing",
    "gallons": "9,999",
    "lagoon": "CAMP-3",
    "lagoonMaterial": "Lime Slurry",
    "source": "Campbell's Soup",
    "ticketDate": "04-13-2022",
    "ticketNumber": "5826",
    "ticketTime": "4:35:44.252 pm",
    "truck": "10",
    "zone": ""
  }
]


function filteredData(e) {
  const filteredData = e.target.value && ticket.filter(val => {
    return val.ticketNumber.toLowerCase().includes(e.target.value);
  });
  console.log(filteredData)

};

<input type="text" onChange="filteredData(event)">

​

Answer 2

也许你应该遍历一下票并返回一张，这给了inputText在字段中的位置？

const filteredData = tickets.filter(ticket => {
  if (inputText === '') {
    return ticket;
  } else if (ticket.ticketNumber.toLowerCase().includes(inputText)) {
    return ticket;
  }
});

如果我正确理解了问题..。

Answer 3

正如@Barmar所建议的那样，用Object.values(obj)循环遍历对象的所有字段，并使用Array.prototype.some()测试是否满足条件。但是就像我说的，您需要做一些不同的事情，因为您有嵌套的对象。

​

const tickets = [{
    index: "-N-ecIthFAo6EaEe7BVT",
    ticket: {
      appName: "biolime",
      driver: "Walt",
      endUser: "Verhoff Farms",
      field: "Marston-North 40",
      gallons: "1,237,887",
      lagoon: "CAMP-3",
      lagoonMaterial: "Lime Slurry",
      source: "Campbell's Soup",
      ticketDate: "04-04-2022",
      ticketNumber: "5825",
      ticketTime: "7:26:49.484 am",
      truck: "",
      zone: "Zone B",
    },
  },
  {
    index: "-N17TZscKkfW0TYE84WZ",
    ticket: {
      appName: "biolime",
      driver: "Walt",
      endUser: "Rob Howell",
      field: "testing",
      gallons: "9,999",
      lagoon: "CAMP-3",
      lagoonMaterial: "Lime Slurry",
      source: "Campbell's Soup",
      ticketDate: "04-13-2022",
      ticketNumber: "5826",
      ticketTime: "4:35:44.252 pm",
      truck: "10",
      zone: "",
    },
  },
];


const filterHelper = (ticket, inputText) => {
  if (inputText === '') {
    return true;
  } else {
    return Object.values(ticket).some((property) => {
      if (typeof property === 'string' || property instanceof String) {
        return property.toString().toLowerCase().includes(inputText);
      } else
        return filterHelper(property, inputText);
    });
  }
};
const filter = (tickets, inputText) => tickets.filter((ticket) => filterHelper(ticket, inputText));

//const filteredData = filter(tickets, "5825");

//console.log(filteredData);

const inputTextInput = document.querySelector("#inputText");
document.querySelector("#form").addEventListener("submit", (e) => {
  e.preventDefault();
  const inputText = inputTextInput.value;
  const filteredData = filter(tickets, inputText);
  console.log(filteredData);
});

<form id="form">
  <input id="inputText" placeholder="filter" />
  <button type="submit">filter</button>
</form>

​