Vue හි රේඩියෝ සමඟ වැඩ කිරීම

රේඩියෝ සමඟ වැඩ කිරීම ද සමාන ආකාරයකින් සිදු කෙරේ. අපි ප්‍රායෝගිකව බලමු. පළමුව, අපි ගුණාංගයක් සාදමු choice, එය අපි radio කණ්ඩායමකට බැඳිය යුතුය:

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

දැන් අපි radio කණ්ඩායමක් සාදමු:

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

ඒ එක් එක් සඳහා v-model නියෝගය ලියන්න සහ එය ගුණාංගයට බන්ධනය කරන්න choice:

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>

ඒ එක් එක්ට තමන්ගේම value ද ලබා දෙමු:

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>

දැන් ගුණාංගයේ choice සැමවිටම තබා ගනු ඇත value තේරූ radio හි:

App.vue<template>
  ඔබ තෝරා ගත්තේ: {{ choice }}
</template>