ImmutableJS how to simplify a filter and update logic

问题

The following is my structure of data

[
  {
    "id": 1,
    "title": "Welcome to my playground",
    "description": "This is so fun to play with, you will like it <3",
    "comments": [
      {
        "id": 1140406,
        "comment": "this is an example comment",
        "postId": 1
      }
    ]
  },
  ...
]

And I'm trying to use immutable js to do this operation

Get all the posts
Search for a post I want to add comment to
Adding the comments when the post is found

The following is my code

posts = posts.map((post) => {

            if(post.get('id') == payload.post_id) {

                return post.update('comments', (comments) => {    
                    return comments.push(Map({
                        id: payload.id,
                        comment: payload.comment
                    }));
                });
            }

            return post;
        });

But I assume this pattern is very common and there should be a simpler way to do this in immutableJS. Any advice will be helpful, thanks.

回答1:

First off, it's worth mentioning that your Data structure is Immutable Lists and Maps.. not JS Arrays and Objects.

OK, without changing your data structure you could do:

posts.map(post => post.get('id') === payload.post_id ?
  post.update('comments', comments.push(payload) :
  post)

If you were to change your data structure, and instead of having a List of posts, had a Map of post's with their ID as the key you could just do:

post.updateIn([payload.post_id, 'comments'], comments => comments.push(payload))

BTW you can use push or concat here, both will function the same.

Also, if comments may be undefined, you can provide a "noSetValue" as a List (https://facebook.github.io/immutable-js/docs/#/List/updateIn):

posts.map(post => post.get('id') === payload.post_id ?
  post.update('comments', Immutable.List([]), comments.push(payload) :
  post)

post.updateIn([payload.post_id, 'comments'], Immutable.List([]), comments => comments.push(payload))

来源：https://stackoverflow.com/questions/34890025/immutablejs-how-to-simplify-a-filter-and-update-logic

标签

redux

immutable.js