Understanding Redux: A Beginner's Guide To State Management/

...

/

Restructuring the State Object

Restructuring the State Object

In this lesson, we'll turn our three independent components into objects and figure out a way to link them.

We'll cover the following...

In the previous lesson, we decided to make our Messages and Contacts components independent.

We now need to figure out a way to connect the two in order to know which messages belong to which user.

Here’s one way to handle this:

Press + to interact
const state = {
  user: [],
  messages: [ 
    {
    messageTo: 'contact1',
      text: "Hello"
    },
    {
      messageTo: 'contact2',
      text: "Hey!"
    }
  ],
  contacts: ['Contact1', 'Contact2']
}

So, all I’ve done is make the messages field an array of message objects. These objects will have a messageTo key.

This key shows ...