Vue-də radio ilə iş

Radio ilə iş eyni qaydada aparılır. Gəlin praktikada baxaq. Əvvəlcə qrupa radio ilə bağlayacağımız choice xassəsini yaradaq:

javascriptdata() {
  return {
    choice: '',
  }
}

İndi isə radio qrupu yaradaq:

App.vue<template>
  <input name="radio" type="radio">
  <input name="radio" type="radio">
  <input name="radio" type="radio">
</template>

Gəlin hər birinə v-model direktivini yazaq və onu choice xassəsi ilə bağlayaq:

App.vue<template>
  <input name="radio" type="radio" v-model="choice">
  <input name="radio" type="radio" v-model="choice">
  <input name="radio" type="radio" v-model="choice">
</template>

Gəlin hər birinə öz value dəyərini verək:

App.vue<template>
  <input name="radio" type="radio" v-model="choice" value="v1">
  <input name="radio" type="radio" v-model="choice" value="v2">
  <input name="radio" type="radio" v-model="choice" value="v3">
</template>

İndi choice xassəsində həmişə seçilmiş radio-nun value dəyəri olacaq:

App.vue<template>
  you choosed: {{ choice }}
</template>