JSFiddle - React, Tailwind, and code Playground

by WoJWoJ

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.3/vue.min.js"></script>
<div id="root">
  <chooser v-model="first"></chooser>
  Here I want to get choice one: {{first}}
  <chooser v-model="second"></chooser>
  Here I want to get choice one: {{second}}
</div>

JavaScript

Vue.component('chooser', {
  template: '<form> <input type="radio" value="hello" v-model="picked"> Hello<br><input type="radio" value="world" v-model="picked"> World<br></form>',
  props: ['which'],
  data: function () {
  return {
  	picked: null
  }
  },
  watch: {
  	picked: function () {
    	this.$emit('picked')
    }
  }
})

var vm = new Vue({
  el: "#root",
  data: {
    first: null,
    second: null
  }
})