Vueでのselectの操作

selectの操作は同様に行われます - タグにv-model属性が付けられ、オブジェクトのdataプロパティにバインドされます。このプロパティには、選択されたoptionタグのテキストが入ります。

次のコードは、ドロップダウンリストの動作例を示しています:

javascriptdata() {
  return {
    selected: 'value1', // デフォルト値
  }
}

App.vue<template>
  <select v-model="selected">
    <option>value1</option>
    <option>value2</option>
    <option>value3</option>
  </select>
  
  <p>{{ selected }}</p>
</template>

Задание 1

selectを使用して、ユーザーにどの都市に住んでいるかを尋ねてください。選択された都市が段落に表示されるようにしてください。