更新嵌套数组 ES6，JavaScript

Question

我有以下对象数组：

[{
  idChatPublic: "1",
  message: "hello",
  chatLike: [{
    id: "1",
    idChatPublic: "1"
  }]
}]

我想要的只是将一个新对象添加到 chatLike 数组中。这是我的尝试，但它似乎没有工作这段代码有什么问题吗？

async function sendLike(messageId: string) {
  const newLike = {
    idChatPublic: messageId,
  }

  mutateMessages(
    (data) => {
      console.log(data) // returns the array I want to update
      data.map((message) => {
        if (message.idChatPublic === messageId) {
          console.log(message.chatLike) // returns the array inside the object I want to update
          return {
            ...message,
            chatLike: [...message.chatLike, newLike]
          }
        } else {
          return message
        }
      })
    }
  )
}

Answer 1

map() 方法创建一个新数组，其中填充了对调用数组中的每个元素调用提供的函数的结果。

可能，您必须使用新数组创建 const 并且 return 它：

const newData = data.map((message) => {
  if (message.idChatPublic === messageId) {
    console.log(message.chatLike) // returns the array inside the object I want to update
    return {
      ...message,
      chatLike: [...message.chatLike, newLike]
    }
  } else {
    return message
  }
});

return newData;

Answer 2

你不需要map()。我想你可以这样做：

async function sendLike(messageId: string) {

 const newLike = {
   idChatPublic: messageId,
 };
 
 mutateMessages((data) => {
   data.forEach((message) => {
     if (message.idChatPublic === messageId) {
       message.chatLike.push(newLike);
     }
   }
 });
 
}

循环使用 forEach() 抛出对象数组，如果 id 匹配，您可以使用 push() 更新 chatLike 数组以添加新的 newLike 对象。

Answer 3

const data = [
  {
    idChatPublic: "1",
    message: "hello",
    chatLike: [
      {
        id: "1",
        idChatPublic: "1",
      },
    ],
  },
];

function updateChatLike() {
  return data.map((d) => {
    return {
      ...d,
      chatLike: [
        ...d.chatLike,
        {
          id: 2,
          idChatPublic: "2",
        },
      ],
    };
  });
}

console.log(JSON.stringify(updateChatLike(), null, 4));

我已经使用 JSON.stringify() 来记录完整的嵌套对象

输出

[
    {
        "idChatPublic": "1",
        "message": "hello",
        "chatLike": [
            {
                "id": "1",
                "idChatPublic": "1"
            },
            {
                "id": 2,
                "idChatPublic": "2"
            }
        ]
    }
]

Answer 4

您的情况不需要地图。

试试这个。

const data = [{
  idChatPublic: "1",
  message: "hello",
  chatLike: [{
    id: "1",
    idChatPublic: "1"
  }]
}];
console.log("before " , data);
sendLike(1);

console.log("after " , data);
function sendLike(messageId) {
 const newLike = {
   idChatPublic: messageId,
 }
 // mutateMessages((data) => {
    data.forEach((message) => {
    //console.log(message.idChatPublic);
      if (message.idChatPublic == messageId) {
        message.chatLike.push(newLike);
      }
    });
  //});

}

更新嵌套数组 ES6，JavaScript

Update nested array ES6, JavaScript

javascript

typescript

ecmascript-6

reactjs