How to access $value in a JSON?

{
  "$id": "1",
  "listTasks": {
    "$id": "2",
    "$values": [
      {
        "$id": "3",
        "id": 1,
        "name": "Task1G1",
        "priorityID": 1,
        "dueDate": "2022-07-14T04:12:14.114",
        "createdAt": "2022-07-14T11:13:06.1808811",
        "enumerable": {
          "$id": "4",
          "$values": [
            2
          ]
        }
      },
      {
        "$id": "5",
        "id": 2,
        "name": "string",
        "priorityID": 1,
        "dueDate": "2022-07-29T08:55:06.156",
        "createdAt": "2022-07-14T15:55:57.0330615",
        "enumerable": {
          "$id": "6",
          "$values": [
            3
          ]
        }
      }
    ]
  }
}

I want to access the secondary $value in this json (enumerable object), I use this code below:

useEffect(() => {
      axios
         .get(API_URL + Task/GetTaskInGroup?GroupID=${id}, {})
         .then((response) => {
            **setTaskList(response.data.listTasks.$values.enumerable.$value);**
         })
         .catch((error) => {
            console.log(error.response.data);
         });
   }, [id]);

But it didn't work, I tried setTaskList(response.data.listTasks.$values) then it work (I can get all data but I can't access to enumerable object)

Try with computed property names (myObject[..]) like below:

response.data.listTasks["$values"][0].enumerable["$values"]

const data = { "$id": "1", "listTasks": { "$id": "2", "$values": [ { "$id": "3", "id": 1, "name": "Task1G1", "priorityID": 1, "dueDate": "2022-07-14T04:12:14.114", "createdAt": "2022-07-14T11:13:06.1808811", "enumerable": { "$id": "4", "$values": [ 2 ] } }, { "$id": "5", "id": 2, "name": "string", "priorityID": 1, "dueDate": "2022-07-29T08:55:06.156", "createdAt": "2022-07-14T15:55:57.0330615", "enumerable": { "$id": "6", "$values": [ 3 ] } } ] } }

console.log(data.listTasks["$values"][0].enumerable["$values"]);