Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

v-model warning when using computed property as a duplicate of prop in Vue 3.3.0-beta.1 #8148

Closed
Mini-ghost opened this issue Apr 24, 2023 · 0 comments

Comments

@Mini-ghost
Copy link
Contributor

Mini-ghost commented Apr 24, 2023

Vue version

3.3.0-beta.1

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-kp9nxc?file=src%2FApp.vue,src%2Fcomponents%2FTextField.vue&terminal=dev

Steps to reproduce

The following code snippet can be executed in Vue 3.2.47, even it's not recommended.

<script setup lang="ts">
import { computed, ref } from 'vue';

const props = defineProps<{ modelValue: string }>();
const emit = defineEmits<{
  (event: 'update:modelValue', value: string): void;
}>();

const modelValue = computed({
  get() {
    return props.modelValue;
  },
  set(value) {
    emit('update:modelValue', value);
  },
});
</script>

<template>
  <div class="card">
    <input v-model="modelValue" type="text" />
  </div>
</template>

It defines a computed property modelValue that duplicates props, and uses modelValue computed property two-way binding with <input> in the <template>. In Vue 3.2.47, no warning is thrown. However, in Vue 3.3.0-beta.1, a warning is displayed.

What is expected?

Although this is not a good practice, it should not throw a warning.

What is actually happening?

截圖 2023-04-24 下午9 13 43

System Info

[plugin:vite:vue] 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.

Any additional comments?

I'm not sure if this was intended, if so please close this issue.

@Mini-ghost Mini-ghost changed the title v-model on prop throws warning in Vue 3.3.0-beta.1 but not in 3.2.47 v-model warning when using computed property as a duplicate of prop in Vue 3.3.0-beta.1 Apr 24, 2023
IAmSSH pushed a commit to IAmSSH/core that referenced this issue May 14, 2023
@github-actions github-actions bot locked and limited conversation to collaborators Sep 11, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants