CODEWITHSUNDEEP
arraysreactjslist
Tryliom
Tryliom

Reputation: 953

How to modify a list in ReactJS?

In my application, I have a list of users (email, first name and last name) that I want to display. I must be able to modify them.

I use an onChange on every input field, I have to store the current field I change and modify it in my list, look like:

{uuid: "1883dbae-9d3d-4c2b-840c-10efa39b9be3", email: "[email protected]", first_name: "U", last_name: "T"}
{uuid: "afc498dc-308f-4cf7-91d0-5933c4ef85f2", email: "[email protected]", first_name: "X", last_name: "XX"}
{uuid: "b4595ed4-af5d-46ca-b480-2bc4ac8d61dc", email: "[email protected]", first_name: "test", last_name: "test"}
{uuid: "af69c46b-0928-4c2e-b190-334b24964fb5", email: "[email protected]", first_name: "", last_name: ""}

I don't find in reactjs how to modifiy, per example, just modify only the first_name of the first line.

My full code of my page: https://hastebin.com/baguteruki.cs

Upvotes: 1

Views: 51

Answers (1)

Rodius
Rodius

Reputation: 2311

Usually you look for the item you want to modify with some kind of id. You could use the uuid for this.

changeName(id, newName) {
  users.forEach(user => {
    if (user.id === id) {
      user.first_name = newName;
    }
  });
}

Upvotes: 1

Related Questions