How can I re-initialize (only) partial of data values in vue?

Question

I know that we can re-initialize the data like this:

function initialData() {
    return {
        is_active: true,
        is_collapsed: true,
        resetable_data: 'value',
        resetable_stat: 4
    }
}

export default {
...
data() {
    return {
        initialData()
    }
},
... 

But I am wondering how we can re-initialize only a portion of the data. I mean something like:

function initialData() {
    return {
        resetable_data: 'value',
        resetable_stat: 4
    }
}

export default {
...
data() {
    return {
        is_active: true,
        is_collapsed: true,
        initialData()
    }
},
... 

Is there a way to do this?

Answer 1

Try Object.assign() :

function initialData() {
    return {
        resetable_data: 'value',
        resetable_stat: 4
    }
}

export default {
...
data() {
    return Object.assign(
        {
            is_active: true,
            is_collapsed: true,
        },
        initialData()
    );
},
... 

Object.assign(target, ...sources) copies the properties of the ...sources (in this case, the object returned by initialData() ) into the target (in this case the object with is_active and is_collapsed ), returning the target object .