Изменение метки объекта по определенному значению в js

Я работаю над диаграммами в React.js и хочу отображать данные, отсортированные по месяцам. В django я создал представление для отображения json с общим количеством событий за месяц, и оно выглядит следующим образом:

    [
        {
            "month": "2022-06-01T00:00:00+02:00",
            "total": 4
        },
        {
            "month": "2022-08-01T00:00:00+02:00",
            "total": 1
        }
    ]
]

Я хочу отсортировать каждый объект в этом массиве и изменить значение 'month' с цифр на название месяца, так что это будет:

    [
        {
            "month": "june",
            "total": 4
        },
        {
            "month": "august",
            "total": 1
        }
    ]
]

Для построения графиков я использую chartist.

Вы можете хранить полную дату как отдельный ключ (с именем date), а месяц устанавливать в отдельной функции, используя предопределенный массив для названий каждого месяца. Вот код, который вы бы использовали:

const monthName = ["January", "February", "March", "April", "May", "June",     
"July", "August", "September", "October", "November", "December"]; // Array representing each month

var chartItems = [
    {
        "date": "2022-06-01T00:00:00+02:00",
        "month": null,
        "total": 4
    },
    {
        "date": "2022-08-01T00:00:00+02:00",
        "month": null,
        "total": 1
    }
];

// Run through each item in the array
function setMonths(arr) {
    arr.forEach(item => {
        const date = new Date(item.date); // Convert date string to Date object
        const monthIndex = date.getMonth(); // Get index of month from the Date
        const month = monthName[monthIndex]; // Convert index into text representing the month

        item.month = month; // Set the month key in the object to the new month
    });
}

setMonths(chartItems); // Call function to set months in the array

В качестве альтернативы можно также сделать метод для каждого объекта в массиве, который получает месяц, но его нужно будет запускать каждый раз, когда вы хотите получить месяц. Вот код для этого:

const monthName = ["January", "February", "March", "April", "May", "June",     
"July", "August", "September", "October", "November", "December"];

var chartItems = [
    {
        "date": "2022-06-01T00:00:00+02:00",
        "month": function() { return monthName[new Date(this.date).getMonth()]; },
        "total": 4
    },
    {
        "date": "2022-08-01T00:00:00+02:00",
        "month": function() { return monthName[new Date(this.date).getMonth()]; },
        "total": 1
    }
];

И вы получите его следующим образом:

chartItems[0].month(); // "[0]", meaning the first item in the array
Вернуться на верх