Change value of an object array element inside an array- js

Question

My array is like so:

 let dup=  [
      {
        "category": "snacks",
        "id": 1,
        "data": [
          {
            "id": 11,
            "title": "choclate",
            "subItem": [],
            "count": 0
          },
          {
            "id": 1,
            "title": "Protein Bar",
            "subItem": [],
            "count": 0
          }
        ]
      },
      {
        "category": "beverages",
        "id": 2,
        "data": [
          {
            "id": 2,
            "title": "Tea",
            "subItem": [
              {
                "id": 1,
                "title": "sugar",
                "status": 1,
                "createdAt": "2021-11-10T03:35:02.500Z",
                "updatedAt": "2021-11-10T03:35:02.500Z"
              }
            ],
            "count": 0
          },
          {
            "id": 3,
            "title": "Coffee",
            "subItem": [
              {
                "id": 1,
                "title": "sugar",
                "status": 1,
                "createdAt": "2021-11-10T03:35:02.500Z",
                "updatedAt": "2021-11-10T03:35:02.500Z"
              }
            ],
            "count": 0
          }
        ]
      }
    ]

I was trying to change the count (just like a shopping cart)

I tried to solve the problem by the function above, but i am not getting the required result. The array is not getting changed.

 function getNewCartItems() {
    let newvar= dup.map(element => (element = element.data.map(item => (item.id === action.item.id ? {...item, count: item.count+1} : item))));
    return newvar;
    }

Hello, I don't quite understand what you mean. Could you tell me your requirements in detail? — vueAng
– vueAng, Commented Nov 15, 2021 at 10:58
I have updated it with more details. could you please check now? — FortuneCookie
– FortuneCookie, Commented Nov 15, 2021 at 11:03
Each one has a count, you need to record the number of ids of the count in each layer, is that what it means? — vueAng
– vueAng, Commented Nov 15, 2021 at 11:08

seedBoot · Accepted Answer · 2021-11-15 10:57:50Z

1

map will return a new array with the changes made by the callback. You want to return that array. Easiest thing to do would be declare it as a variable and return it:

const newCart = dup.map(...)
return newCart

answered Nov 15, 2021 at 10:57

seedBoot

4243 silver badges14 bronze badges

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

Comments

FortuneCookie · Accepted Answer · 2021-11-15 11:30:41Z

0

Solved by the following:

function getNewCartItems() {
      const newArr = state.data?.map(element => {
        return {
          ...element,
          data: element?.data?.map(item => (item.id === action.item.id ? {...item, count: item.count + 1} : item)),
        };
      });
      return newArr;
    }

answered Nov 15, 2021 at 11:30

FortuneCookie

1,8625 gold badges30 silver badges44 bronze badges

Collectives™ on Stack Overflow

Change value of an object array element inside an array- js

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