Vueでのselectの操作
selectの操作は同様に行われます -
タグにv-model属性が付けられ、
オブジェクトのdataプロパティにバインドされます。
このプロパティには、選択されたoptionタグのテキストが入ります。
次のコードは、ドロップダウンリストの動作例を示しています:
data() {
return {
selected: 'value1', // デフォルト値
}
}
<template>
<select v-model="selected">
<option>value1</option>
<option>value2</option>
<option>value3</option>
</select>
<p>{{ selected }}</p>
</template>
selectを使用して、ユーザーにどの都市に住んでいるかを尋ねてください。
選択された都市が段落に表示されるようにしてください。
