Vue - Two Way Bind to checkbox

using multiple included booleans

by Ben Clayton

HTML

<script src="https://unpkg.com/vue"></script>
<div id="div1">
	<div v-for="item in items">
  <h5><input type="checkbox" @change="mychange(item)" v-model="item.included" />{{item.name}} is {{ item.included }} {{ color }}</h5>
	</div>
	
</div>

CSS

.interface {}

JavaScript

//---------------------------------------------------------

var myData = [{name:"Red", included:true },{name:"Green", included:false },{name:"Blue", included:false }];

var vm1 = new Vue({
  el: '#div1',
  data: {items:myData, color:'Pink'},
	methods:{
		mychange:function(item){
			console.log(item.name,item.included);
		}
	
	}
});