【问题标题】:Move nested array objects to another nested array by checking object value通过检查对象值将嵌套数组对象移动到另一个嵌套数组
【发布时间】:2021-09-03 09:51:31
【问题描述】:

我正在解决一个问题,其中我使用对象嵌套了数组,我需要检查 myData.consumedParts 数组中的部分或所有对象是否被值为 true 消耗。

const myData = [
 {
    name: "sample data 1",
    code: "450W0619P001",
    consumedParts: [
      { serial: "arr 1 - part 1", consumed: true },
      { serial: "arr 1 - part 2", consumed: false },
    ],
  },
  {
    name: "sample data 2",
    code: "450W0619P001",
    consumedParts: [
      { serial: "arr 2 - part 1", consumed: true },
      { serial: "arr 2 - part 2", consumed: true },
    ],
  },
];
const [parts, setParts] = useState(myData);

然后我需要将消耗的对象保存在另一种状态。我正在尝试使用以下功能,它成功删除了消耗的物品,但没有将它们保存在新状态 [consumedParts, setConsumedParts]

const [consumedParts, setConsumedParts] = useState([]);
  const markConsumed = (index) => {
    const newParts = [...parts];
    const SelectedParts = newParts[index].reserved;
    const newDelTodo = consumedParts.slice();
    for (let i = SelectedParts.length - 1; i >= 0; --i) {
      if (SelectedParts[i].selected == true) {
        SelectedParts.splice(i, 1);
        newDelTodo.push(SelectedParts[i]);
      }
    }
    setConsumedParts(newDelTodo);
    setParts(newParts);
  };

请查看并告诉我如何使此代码正常工作。谢谢

【问题讨论】:

  • 你可以让它变得简单,只需要引入新的属性合并消费和保留,然后使用它。
  • 感谢@ToufiqAhmed 的回复。我想我没有正确写出我的问题。我需要检查我的嵌套数组是否已经消耗了部分,如果是,那么我需要使用反应状态钩子将它们推送到另一个数组中。更新了问题。
  • 上述数据的预期输出是什么?
  • 需要检查并从嵌套数组中删除所有消耗的部分并将它们存储到反应状态。 myData 数组应如下所示: const myData = [ { name: "sample data 1", code: "450W0619P001", consumeParts: [ { serial: "arr 1 - part 1", consume: true }, -- 删除并添加到新状态 { 序列:“arr 1 - 第 2 部分”,消耗:假 },],},......其余数组代码];
  • @Bhaskeragrawal 尝试移动 SelectedParts.splice(i, 1);在 newDelTodo.push(SelectedParts[i]); 之后

标签: javascript arrays reactjs react-native


【解决方案1】:

您可以使用array#map 遍历您的数据,并使用array#filter 过滤consumedParts 状态。

const myData = [ { name: "sample data 1", code: "450W0619P001", consumedParts: [ { serial: "arr 1 - part 1", consumed: true }, { serial: "arr 1 - part 2", consumed: false }, ], }, { name: "sample data 2", code: "450W0619P001", consumedParts: [ { serial: "arr 2 - part 1", consumed: true }, { serial: "arr 2 - part 2", consumed: true }, ], }, ],
     getConsumedParts = (status) => myData.map(o => {
        return {
          ...o,
          consumedParts: o.consumedParts.filter(o => o.consumed === status)
        }
     });
console.log(getConsumedParts(true));
console.log(getConsumedParts(false));
.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】:

  • 谢谢。但我需要将所有消耗的 = true 部分移动到另一个数组中。
  • 您可以使用getConsumedParts(true) 并分配给一个新变量。
猜你喜欢
  • 2020-08-04
  • 2021-11-17
  • 2020-09-17
  • 1970-01-01
  • 2021-07-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-03-11
相关资源
最近更新 更多