Travailler avec select dans Vue

Le travail avec select s'effectue de manière analogue - un attribut v-model est attaché à la balise, lié à une propriété de l'objet data. Dans cette propriété sera récupéré le texte de la balise option sélectionnée.

Le code suivant démontre un exemple de fonctionnement d'une liste déroulante :

javascriptdata() {
  return {
    selected: 'value1', // valeur par défaut
  }
}
App.vue<template>
  <select v-model="selected">
    <option>value1</option>
    <option>value2</option>
    <option>value3</option>
  </select>
  
  <p>{{ selected }}</p>
</template>
Задание 1

Demandez à l'utilisateur à l'aide d'un select dans quelle ville il habite. Faites en sorte que la ville choisie s'affiche dans un paragraphe.