Как назначить несколько свойств существующему объекту, ЕСЛИ это свойство также имеет вложенные свойства внутри него?

Question

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

data: function() {
    return {
        chartData: {}
    }
},

По сути, я хочу создать эту структуру:

data: function() {
    return {
        chartData: {
            labels: ["One", "Two"];
            datasets: [{
                data: ["5", "10"],
                label: "Chart"
            }]
        }
    }
}

Этот код успешно добавляет свойство и значение метки, сохраняя при этом реактивность, однакоЯ не могу понять, как также добавить свойство наборов данных, которое само имеет вложенные свойства

this.chartData = Object.assign({}, this.chartData, { labels: ['One', 'Two']})

Я понял это, прочитав https://vuejs.org/v2/guide/reactivity.html, однако они не показали, какдобавить свойства, которые имеют вложенные свойства.

Answer 1

Вот один метод построения этого объекта с использованием распространяемого синтаксиса :

// Empty chartData
const chartData = {};

// Your two sets of data
const labels = ['One', 'Two'];
const datasets = { datasets: [{ data: ['5', '10'], label: 'Chart'}] };

// Merge the existing chartData, and labels and datasets together
const newChartData = { chartData: { ...chartData, labels: [...labels], ...datasets } };

console.log(newChartData);