Selectin käyttö Vuesa
select:in
kanssa työskentely tapahtuu vastaavasti - tagiin lisätään
v-model-attribuutti, joka sidotaan
data-objektin ominaisuuteen. Tähän ominaisuuteen
päätyy valitun option
-tagin teksti.
Seuraava koodi demonstroi pudotusvalikon toimintaa:
data() {
return {
selected: 'value1', // oletusarvo
}
}
<template>
<select v-model="selected">
<option>value1</option>
<option>value2</option>
<option>value3</option>
</select>
<p>{{ selected }}</p>
</template>
Kysy käyttäjältä select:in avulla,
missä kaupungissa hän asuu. Tee niin, että
valittu kaupunki tulostuu kappaleeseen.