Search code examples
javascriptreactjsjavascript-objectsreact-context

Adding Objects to another object


I'm trying to add object inside an object with id as a key in react provider. Following is the use case.

const [memberList, setMemberList] = useState({
  homeTeam: [],
  awayTeam: [],
  homeTeamClone: {},
});

I can successfully add member to an array, however I'm more keen to add that in homeTeamClone object.

example of object = {"id":"3a21b0a-1223-46-5abe-67b653be5704","memberName":"Adam"}

I want final result as

homeTeamClone: {
  "3a21b0a-1223-46-5abe-67b653be5704": {"id":"3a21b0a-1223-46-5abe-67b653be5704","memberName":"Adam"},
  "3a21b0a-1223-46-5abe-67b653be5705": {"id":"3a21b0a-1223-46-5abe-67b653be5705","memberName":"Chris"},
  "3a21b0a-1223-46-5abe-67b653be5706": {"id":"3a21b0a-1223-46-5abe-67b653be5706","memberName":"Martin"},
}

I tried Object.assign(homeTeamClone, member) but did not get the expected result.

Thanks in Advance.


Solution

  • If the question is how to set individual member than you can do this:

    const member = { id: '3a21b0a-1223-46-5abe-67b653be5704', memberName: 'Adam' };
    
    setMemberList({
      ...memberList,
      homeTeamClone: {
        ...memberList.homeTeamClone,
        [member.id]: member,
      },
    });
    

    In this case spread all old values and add new one. (In case user with same ID is added again, object value will be from the new one)