首页 > 解决方案 > 返回对象数组中的对象数组中的项

问题描述

我正在尝试根据嵌套数组对象中的布尔值返回主对象中的值。如果主数组中的值是真的,那么它应该在子数组中寻找槽并且只返回那些是真的。我已经尝试了很长时间,但似乎无法找到解决方案。它返回嵌套数组中的所有对象,无论是真还是假。将不胜感激。

  const DATA = [
  {
  day: 'Monday',
  label: 'Monday',
  checked: false,**strong text**
  slots: [
    {slot: '9-10', checked: false},
    {slot: '10-11', checked: false},
  ],
},
{
  day: 'Tuesday',
  label: 'Tuesday',
  checked: false,
  slots: [
    {slot: '9-10', checked: false},
    {slot: '10-11', checked: false},
  ],
},
{
  day: 'Wednesday',
  label: 'Wednesday',
  checked: false,
  slots: [
    {slot: '9-10', checked: false},
    {slot: '10-11', checked: false},
  ],
},
{
  day: 'Thursday',
  label: 'Thursday',
  checked: false,
  slots: [
    {slot: '9-10', checked: false},
    {slot: '10-11', checked: false},
  ],
},
{
  day: 'Friday',
  label: 'Friday',
  checked: false,
  slots: [
    {slot: '9-10', checked: false},
    {slot: '10-11', checked: false},
  ],
},
{
  day: 'Saturday',
  label: 'Saturday',
  checked: false,
  slots: [
    {slot: '9-10', checked: false},
    {slot: '10-11', checked: false},
  ],
},

];

  useEffect(() => {
  setDaysCollection(DATA);
  }, []);
  const selectedDays = daysCollection.filter(
  (item: any) =>
    item.checked == true &&
    item.slots.filter(r => r.checked == true),
  );
 setSelectedItem(selectedDays);

标签: javascriptarraysreactjs

解决方案


Array.prototype.filter()期望一个布尔值返回,虽然您可以使用它来改变原始数组,但使用返回的数组会更干净。

这是一个使用some()断言检查槽的示例,以及map()进一步过滤嵌套数组的调用。

//{ day: 'Tuesday', label: 'Tuesday', checked: true, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: true },], }
const DATA = [{ day: 'Monday', label: 'Monday', checked: false, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: false },], }, { day: 'Tuesday', label: 'Tuesday', checked: true, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: true },], }, { day: 'Wednesday', label: 'Wednesday', checked: false, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: false },], }, { day: 'Thursday', label: 'Thursday', checked: false, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: false },], }, { day: 'Friday', label: 'Friday', checked: false, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: false },], }, { day: 'Saturday', label: 'Saturday', checked: false, slots: [{ slot: '9-10', checked: false }, { slot: '10-11', checked: false },], },];

const result = DATA
  .filter(({ checked, slots }) =>
    checked && slots.some(({ checked }) => checked)
  )
  .map(o => ({ ...o, slots: o.slots.filter(({ checked }) => checked) }));

console.log(result);


推荐阅读