v-model и defineModel()

v-model - Двусторонняя привязка данных

defineModel() - Упрощает создание пользовательских компонентов с поддержкой v-model в Composition API.

1
2
3
4
5
6
7
8
9
10
11
12
13
// App.vue<script setup>import { ref } from 'vue'  import Comp from './Comp.vue'  const value = ref('')</script>  <template>  <p>{{value}}</p>  <Comp v-model="value" /></template>

1
2
3
4
5
6
7
8
9
10
// Comp.vue<script setup>import { defineModel } from 'vue';  const model = defineModel()</script>  <template>  <input :value="model" @input="model = $event.target.value" /></template>