Vue - Two Way Bind to Radio
using single bound value
by Ben Clayton
HTML
<script src="https://unpkg.com/vue"></script>
<div id="div1">
<div v-for="item in items">
<h5><input type="radio" @change="mychange(item)" v-bind:value="item.name" name="color-selector" v-model="color" />{{item.name}} ( {{ color }} is chosen)</h5>
</div>
</div>
CSS
.interface {}
JavaScript
//---------------------------------------------------------
var myData = [{name:"Red" },{name:"Green" },{name:"Blue" }];
var vm1 = new Vue({
el: '#div1',
data: {items:myData, color:'Green'},
methods:{
mychange:function(item){
console.log(item.name);
}
}
});