Vue: Component's `data` property must be function restriction

[yaquawa]

What problem does this feature solve?

Take off this restriction would increase the consistency.

I understand that every component needs a copy of the data object.
But can't you just copy the data object under the hood? Are there any benefits by using a function instead?

What does the proposed API look like?

Vue.component('foo', {
    data: {
        foo: 'bar'
    }
});

[posva]

This is a technical restriction due to javascript

[yaquawa]

@posva
Can you tell me what exactly the technical restriction it is...?

[posva]

It's because in js objects are references, please, ask questions on the forums or discord server 🙂

[fnlctrl]

But can't you just copy the data object under the hood? Are there any benefits by using a function instead?

Deep cloning objects (copy the data object under the hood) causes 1). heavy performance overhead 2). bloated code for a deep clone implementation. So it's better to just use a function to create a fresh object every time.

[yaquawa]

@posva
Thanks :)
Yes, but I mean can't we just use Object.assign to clone the data object..?

[jacekkarczmarczyk]

Object.assign is not deep