Skip to content

misleading error message when nesting/passing on v-model #13280

Open
@zsoldosp

Description

@zsoldosp

Vue version

3.5.13

Link to minimal reproduction

https://play.vuejs.org/#eNqtU8tOwzAQ/JXFl4AEzQFOVXmLA0g8BBx9Sd1NMXXsyHZKpSj/ztqhbdoUBBK3eHd2PDue1OyyLAfzCtmQjTwWpco8nnENMLqXk4nCa1OURqP2MD8qzATV0FXjQnov9fSUs/WBM0hpcJR2WOjohJWlB4e+KkFlccg7zuIdkrithxos5tBAbk0BCYlJOs1tGS1okG7Vww5xDEAY7ejGlTI4DfyjsTEKM322n2fK4UGQ2oojKeyQRNFcLqeDd2c0uVEHMs4EXSAV2sfSS+LlbAixE3qZUubjLta8rfBwWRdvKGY76u9uEWqcPVl0aOfI2arnMztF37ZvXh5wQd+rJhlfKUL/0HxGZ1QVNLawq0qTPbaDi2pvo6lkyqu7WXjUbrlUEBqQTcRzRnYGb79bfS33eHAS57huyMUdr9JP1q3WaHvB+q80bbEv87JZXsUlTeHD2Fm4Mp52hGeCudR4HzSuQ5SsIQllKRLlmVRfRL+Z2cxfX1/fuHHlvdFwIZQUsw2/SOZe172IB6jr7irnkIhMC1QJDOFLTAINPR1xpy35X03/rV+9n441nwK9jA4=

Steps to reproduce

have a three component deep hierarchy, e.g.: App - Middle - Inner as per the repro
in App, declare a ref to hold the value
pass it to Middle via v-model
in Middle,

  • only use defineModel, but don't store it in a local const
  • pass it to Inner via v-model

What is expected?

I would expect one of the following

  • it should work (same way when I use a prop/model only in the template then I don't have to store it in a local const)
  • an error message telling me I should probably store the Middle's model in a local const
  • an explanation/warning in the docs in https://vuejs.org/guide/components/v-model.html

What is actually happening?

A misleading (though technically probably correct) error message

(2:28) v-model cannot be used on a prop, because local prop bindings are not writable. Use a v-bind binding combined with a v-on listener that emits update:x event instead.

System Info

Any additional comments?

the repro is the stripped down to the core prod code we used that triggered the issue

in the repro, in MiddleComponent.vue it has the working version too, just commented out

p.s.: https://new-issue.vuejs.org/?repo=vuejs/core doesn't prefill the github anymore

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions