JSFiddle - React, Tailwind, and code Playground

by ChangJoo Park

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<div id="app">
  <input type="radio" id="one" value="One" v-model="selected">
  <label for="one">One</label>
  <br>
  <input type="radio" id="two" value="Two" v-model="selected">
  <label for="two">Two</label>
  <br>
  <span>Picked: {{ picked }}</span>
  <p>Selected: {{ selected }}</p>
</div>

JavaScript

new Vue({
  el: '#app',
  data: function() {
    return {
      picked: ''
    }
  },
  computed: {
    selected: {
      get: function() {
        console.log(this.picked)
        return this.picked;
      },
      set: function(v) {
        console.log(v);
        setTimeout(function() {
          this.picked = v;
        }.bind(this), 300);
      }
    }
  }
})