How to modify a complex JSON Object in using Immutable

Question

I have below JSON and wanted to update the value depending on Aid, Bid and Cid using Immutable.js

e.g. Below input provided. Aid= A, Bid = 1, Cid= 4, NewValue = 'FOUR' If above input is provided the value "One" needs to be changed to "FOUR"

let sampleJson = {
  Aid: 'A', detail:"sample", list: [
   {
      "Bid": "1",
      "group": [
    {
      "name": "Group A",
      "Cid": "4",
      "value": "One"
    },
    {
      "name": "Group A",
      "Cid": "41",
      "value": "1"
    },
  ]
},
{
  "Bid": "2",
  "group": [
    {
      "name": "Group A",
      "Cid": "4",
      "value": "1"
    },
    {
      "name": "Group A",
      "Cid": "4",
      "value": "1"
    },
  ]
};

I was able to access the value using below code. How can i return the entire JSON with updated value?

let variale = Immutable.fromJS(sampleJson).
getIn(['list']).
find(allocation => allocation.get("Bid") === "1").
getIn(['group']).
find(fun => fun.get("Cid") === "4").set('value',"FOUR");

Anyone has any suggestions on how to resolve this problem?

I have looked into setIn method. setIn works when you have a ImmutableMap. It seems when I use Immutable.fromJS above json gets converted to list and map. That is where I am struggling. — RelexReact
– RelexReact, Commented Jul 28, 2016 at 16:39

alunyov · Accepted Answer · 2016-07-28 21:21:20Z

1

I think you can try to do this like so:

let immutable = Immutable.fromJS(sampleJson);
immutable = immutable.setIn(['list', 0, 'group', 0, 'value'], 'FOUR');

answered Jul 28, 2016 at 21:21

alunyov

9431 gold badge10 silver badges14 bronze badges

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

Comments

David Gilbertson · Accepted Answer · 2016-07-29 00:59:41Z

This monstrosity is how I would do it:

const newData = originalData.update('list', list => {
  const itemIndex = list.findIndex(item => item.get('Bid') === '2');

  return list.update(itemIndex, listItem => {
    return listItem.update('group', groupList => {
      const groupIndex = list.findIndex(group => group.get('Cid') === '4');

      return groupList.update(groupIndex, group => {
        return group.set('value', 'FOUR');
      });
    });
  });
});

https://jsbin.com/latupo/7/edit?html,js,console

Personally I stopped using Immutable, I always found it a bit painful (not to mention those docs!). I now use redux and good old cloning to not mutate state. Less performant in theory but if you've got nothing that runs over a few milliseconds anyway, save yourself the trouble...

Collectives™ on Stack Overflow

How to modify a complex JSON Object in using Immutable

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related