Ce que devient v-model

<script setup>
import { ref } from "vue";
import ChampTitre from "./ChampTitre.vue";

const titre = ref("Java");
</script>

<template>
  <!-- Ce que <ChampTitre v-model="titre" /> devient -->
  <ChampTitre
    :model-value="titre"
    @update:model-value="(valeur) => (titre = valeur)"
  />
  <p>Titre : {{ titre }}</p>
</template>

Après avoir remplacé « Java » par « JavaScript » dans le champ, la page affiche :

Titre : JavaScript

Dans un gabarit de fichier .vue, la prop peut s'écrire :model-value ou :modelValue, et l'événement @update:model-value ou @update:modelValue : Vue accepte les deux formes.