How to pass nested object within an object in reducer

Question

I'm trying to pass a nested object within an object within a reducer.

im telling redux to pass like along with the ...post. However it's giving me

like is not defined.

Reducer

const initialState = {
    post: [],
    postError: null,
    posts:[],
    isEditing:false,
    isEditingId:null,
    likes:0,
    postId:null
}

 case ADD_LIKE:
    console.log(action.id) // renders post id which is 2
    console.log(state.posts) // logs posts array
    console.log(state.posts)
        return {
        ...state,
        posts: state.posts.map(post => {
          if (post.id === action.id) {
                post.Likes.map( (like) => {
                    console.log(like); // renders like log
                })
            } 
            return {
                ...post,
                ...like, /// need to pass the like here but it says is not defined
                Likes: like.Likes + 1
            }      

        })
      };

console.log(like); // renders this

Like count are being called here

 <Like like={id} likes={Likes.length} />

in your return, like is not defined because it is not defined in initialstate, you can get that info maybe usaing action.payload.data.post.like — ProblemsEverywhere
– ProblemsEverywhere, Commented Apr 24, 2019 at 12:18
Thank you for responding, im looking to get the mappped (like) it can be called whatever. but its called like and that is what i want passed next to ...post — randal
– randal, Commented Apr 24, 2019 at 12:24
and what if you 'save' that map? Likes aren't on the last scope, so if you 'store' them maybe you can call them later: var a= post.Likes.map( (like) => { — ProblemsEverywhere
– ProblemsEverywhere, Commented Apr 24, 2019 at 12:27
Would it be possible to provide an answer, explaining how you would better write it so like can become assessable. I learn and understand better that way. — randal
– randal, Commented Apr 24, 2019 at 12:30

Prabu samvel · Accepted Answer · 2019-04-24 12:42:22Z

1

I think you have a problem inside the return.

From the code, Here where you initialize the like variable (inside the map).

post.Likes.map( (like) => {
  console.log(like); // renders like log
})

So, the scope of like will not exist outside of it. But, you are trying to access it outside in return.

return {
   ...post,
   ...like,
   Likes: like.Likes + 1
}

Edited

If I understand your expectation correct. Here the solution.

return {
     ...post,
     ...post.Likes, 
     Likes: post.Likes.length + 1
}

edited Apr 24, 2019 at 12:42

answered Apr 24, 2019 at 12:24

Prabu samvel

1,2138 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

randal Over a year ago

what would be the solution. How would you better write the code so that i can access ...like

Prabu samvel Over a year ago

Likes: like.Likes + 1 is that just for likes count right? @randal

randal Over a year ago

right that is correct. i want to use the like thats mapped from post.Likes.map(like)

Prabu samvel Over a year ago

Updated the answer @randal

randal Over a year ago

The like counts disappears after i click like. So their needs to be another way

|

Collectives™ on Stack Overflow

How to pass nested object within an object in reducer

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related