Immutable, update inside map not returning correct object

问题

I am trying to write a function to update an immutable object I have. I am using return myitem.updateIn so i can chain another update ontop of this one that is already working. So far, I have this :

memo.updateIn(['Topics', 'filters'], function(topic) {
  topic.map(function(singleTopic) {
    singleTopic.update('filters', function(subTopicFilters) {
      subTopicFilters.map(function(singleSubTopic) {
        if(singleSubTopic.get('checked')){
            console.log("check", singleTopic.toJS());
            return singleTopic.set('checked', true);
        }
      })
    })
  })
});

The console log inside is hitting the correct part, however this is does not seem to be updating the immutable map as I assumed it would have. The checked value in psycological disorders should be set to true. See fiddle here for example https://jsfiddle.net/alexjm/c5edxaue/27/ .

For some context, this is being used in a return where a couple of separate .update will be run on the memo in order like this

returnModifiedData(memo) {
   return memo.update (....

   ).update( .....

   .update();

This function is the first step in this process, the other 2 are already working. I am not sure what I am doing wrong to not get this to update correctly, possibly how I am trying to .set the singletopic inside? The basic logic is check if the topic has and sub topics with checked inside, and if so, check off the topic. Any help would be greatly appreciated. Thanks!

EDIT : forgot to add what the memo itself looks like :

const memo = {
  "Topics": {
    "filters": {
      "Psychological disorders": {
        "checked": false,
        "filters": {
          "Anxiety disorders": {
            "filters": {},
            "checked": true
          }
        }
      },
      "test": {
        "checked": false,
        "filters": {
          "test": {
            "filters": {},
            "checked": false
          }
        }
      }
    },
    "isOpen": false
  }
};

回答1:

It'd be better if you can explain what's the logic you want to achieve.

I'll guess it here:

Iterate through and update items in Topics->filters.
For each singleTopic iterated, further iterate through it's filters.
If any of its singleSubTopic have checked to be true, update the singleTopic's checked to be true.

And below is what you may expect:

const map = {
  "Topics": {
    "filters": {
      "Psychological disorders": {
        "checked": false,
        "filters": {
          "Anxiety disorders": {
            "filters": {},
            "checked": true
          }
        }
      },
      "test": {
        "checked": false,
        "filters": {
          "test": {
            "filters": {},
            "checked": false
          }
        }
      }
    },
    "isOpen": false
  }
};

let memo = Immutable.fromJS(map);

memo = memo.updateIn(['Topics', 'filters'], function(topics) {
  // Remember to return the updated topics.
  return topics.map(function(singleTopic) {
    // If singleTopic has any of its singleSubTopic under filters have value checked=== true
    // update the singleTopic's checked, otherwise return unaltered.
    if (singleTopic.get('filters').some(function(singleSubTopic) {
      return singleSubTopic.get('checked');
    })) {
      return singleTopic.set('checked', true);
    }
    return singleTopic;
  });
});

console.log(memo.toJS());

<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.1/immutable.min.js"></script>

来源：https://stackoverflow.com/questions/36746377/immutable-update-inside-map-not-returning-correct-object

标签

javascript

immutable.js