Version

3.1.2

Reproduction link

Vue 3 - not working:

sfc.vuejs.org

Vue 2 - working:

https://codepen.io/jkarczm/pen/ZEeNNPW?editors=1010

Steps to reproduce

<input v-model="whatever().something">

What is expected?

No compilation error

What is actually happening?

v-model value must be a valid JavaScript member expression.

some improvements were made in (bc100c5c48b98b6e2eabfa1d50e0d3099ea2a90d ) to cover more valid expressions, but it does not cover all valid member expressions. like the one you encountered.

<input v-model="what().ever">

if your function does not have dynamic arguments, you can wrap the function in a computed

what = computed( ()=> whatever())

<input v-model="what.ever">

if you do have dynamic arguments, it will complicate things to work around that limitation.

if you function does not have dynamic arguments, you can wrap the function in a computed

Yeah, but if it has and they come from v-for (like in the example in my comment in the mentioned commit) i can't use computed. I wonder why do we even need this check, vue doesn't check if you have proper expression in v-bind:foo or in mustaches, you're just getting a syntax or runtime error, why it's not enough in v-model?

and here is a possible workaround if you really need dynamic arguments

https://sfc-vue3.netlify.app/#/gist/c1242a00f99d8a3ed26cb002303dfcca

I originally recommended reducing that to a development warning and not an error. due to incomplete validation.

Using the return value of a function in v-model used to work in vue 2. I encountered this problem after upgrading my app to vue 3

Same problem here:

`export default { store: store, name: "ValuesConstraintsMarginUnit", mixins: [HtmlAdapter],

props: { labels: { type: Array, default: function() { return []; } }, values: { type: Array, default: function() { return []; } }, }, methods: { getValuesMarginMin() { return this.values[0]; }, ...`