docs(v-model): document factory-function defaults for objects/arrays#3434
Open
pcoterecollective wants to merge 1 commit into
Open
docs(v-model): document factory-function defaults for objects/arrays#3434pcoterecollective wants to merge 1 commit into
pcoterecollective wants to merge 1 commit into
Conversation
✅ Deploy Preview for vuejs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Author
|
@brc-dd — mind a quick look when you get a chance? The |
Member
|
I'm fine with adding it, but generally speaking you should never mutate a prop or model. The recommended way is to create a model and do an assignment to replace the value. |
Contributor
|
Just a quick note: a pull request with a similar proposal has already been opened (#3410) |
bencodezen
reviewed
Jul 23, 2026
| const model = defineModel({ default: 0 }) | ||
| ``` | ||
|
|
||
| When the default value is an object or array, return it from a factory function, just as with [prop defaults](/guide/components/props#prop-validation). Otherwise every component instance that falls back to the default shares the **same** reference, and mutating the model in one instance leaks into the others: |
Member
There was a problem hiding this comment.
Suggested change
| When the default value is an object or array, return it from a factory function, just as with [prop defaults](/guide/components/props#prop-validation). Otherwise every component instance that falls back to the default shares the **same** reference, and mutating the model in one instance leaks into the others: | |
| When the default value is an object or array, it will be shared across all instances of the component because it shares the same reference. In other words, changing the model in one instance will affect the other instances. | |
| Similar to [prop defaults](/guide/components/props#prop-validation), if you want the component instances to have their own unique values, you need to return it from a factory function. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
The
defineModel()default section on thev-modelpage only documents a primitive default (default: 0). BecausedefineModel()declares a regular prop, itsdefaultis resolved through the same machinery asdefineProps— so an object/array default that isn't a factory function is shared across every component instance, and mutating the model in one instance leaks into the others.This adds a short note + example right after the existing default example, and links to Prop Validation where the factory-function rule is already stated. The page even uses factory syntax for
modelModifiers, just never for the value default.Repro
Vue SFC Playground
default: {}): both instances render the same object id — one shared reference.default: () => ({})): each instance renders a different object id — a fresh object per instance.