在 useState 中向数组添加值，但仅在数组的特定索引处

Question

我有一个状态，其中包含一组评论。

每条评论都有一组回复。

如何向评论数组中特定评论的回复数组添加回复值？

这是我目前的尝试：

      if (data) {

        const isLargeNumber = (comment) => comment.id === reply.commentId;

        const idx = comments.findIndex(isLargeNumber);

        setPost({
          ...post,
          comments: {
            ...comments[idx],
            replies: [data.replyToComment, ...post.comments[idx].replies]
          }
        })

        resetValues();
      }

idx 包含我需要的正确值，但我认为我的实现在这里不正确。

Answer 1

由于post.comments是一个数组，你当然需要创建一个数组，而不是一个带有{ }的普通对象。您在嵌套结构中缺少一个级别（评论数组，而不是特定评论）。您可以使用 Object.assign 替换 [idx]:

处的条目

  const idx = post.comments.findIndex(isLargeNumber);

  setPost({
    ...post,
    comments: Object.assign([...post.comments], {
      [idx]: {
        ...post.comments[idx],
        replies: [data.replyToComment, ...post.comments[idx].replies]
      }
    })
  });

Answer 2

改编自：

    setPost({
        ...post,
        comments: [
            ...post.comments.slice(0, idx),
            {
                ...post.comments[idx],
                replies: [...post.comments[idx].replies, data.replyToComment]
            },
            ...post.comments.slice(idx + 1)
        ]
    });

在 useState 中向数组添加值，但仅在数组的特定索引处

Adding value to an array in useState but only at a particular index of the array

javascript

reactjs

use-state