如何在不影响其他用户的个人资料的情况下将数据添加到用户的个人资料 React答案

【问题标题】：how to add data to a user's profile while not affecting other users' profile React如何在不影响其他用户的个人资料的情况下将数据添加到用户的个人资料 React
【发布时间】：2021-06-05 23:11:21
【问题描述】：

当用户被点击时，它会转到他/她的个人资料页面。单击个人资料页面上的注释标签，用户可以将消息添加到他/她的个人资料中。

【问题讨论】：

notes 数组代表什么？每个元素对每个患者都有一个注释？患者数组中是否有多个音符？
您是否存储了每个配置文件注释，以及获取它们的位置
@DrewReese。每当创建笔记时，它看起来像这样 { userPic: , user: "Test User", time: formatAMPM(new Date()), note: note, id: generateId(), isFinal: false, };所以 notes 数组包含对象。是的，患者可以有多个阵列。我认为现在的问题是 notes 数组对所有患者都是全局的。我需要找到一种方法只为目标患者添加注释
那么每个患者一个笔记对象，还是没有？
@DrewReese。 note 对象应用于正在编辑其个人资料的患者

标签： javascript reactjs filter components add

【解决方案1】：

你有一个非常复杂的代码，但我试图理解你的观点......最后哦好的，所以每个患者都必须有自己的笔记，您必须首先将患者 ID 添加到每个笔记对象，这样做是通过获取 id 参数（您已经这样做了，并将其传递给 AddNote 组件：

export default function EditPatient({//...})
  //.....
const { id } = useParams();
 //.....
<AddNote addNote={handleAddNote} idPatient={id} />

现在，转到您的 AddNote 组件，我们需要像这样将患者 ID 添加到注释对象：

export default function AddNote({ addNote, idPatient }) {
/...
const newNote = {
          userPic: <AccountBoxIcon color="primary" fontSize="large" />,
          user: "Test User",
          time: formatAMPM(new Date()),
          note: note,
          id: generateId(),
          isFinal: false,
          idPatient: idPatient //<----add it here
        };

现在，剩下要做的就是根据 idPatient 过滤每个患者资料的注释，然后返回到 EditPatient 组件：

export default function EditPatient({
   //....
const { id } = useParams();
notes = notes.filter((note)=> note.idPatient === id)

PS：当你做得很好时，你会让你的代码变得如此复杂和不可读，所以我的建议是使用 Context api 或 redux 之类的状态管理工具来让你的代码更干净、更易于维护，而不是使用顶级的 useState ()

【讨论】：

感谢您的诚实cmets哈哈！我按照你的建议做了。但是 idPatient 发生了变异。例如，当给患者 1 添加注释时，idPatient 为 1。然后当给患者 2 添加注释时，患者 1 的 idPatient 更改为 2。
无法弄清楚它是如何变异的，您的代码中没有副作用函数
Okey 我在最后一段代码中犯了一个错误，我应该使用 === 来比较，而不是我使用 = 并且总是将所有笔记的 idPatient 更改为最后一个 hhh 好的，我的错，我'将编辑我的答案
并且不要使用 const，因为 notes 已经声明
哇哦！现在可以了。请不要道歉哈哈！非常感谢您无条件的帮助！除了使用 redux 来管理状态。还有什么可以帮助我的代码看起来更好的吗？