<template>
<div>
<div class="line-list line-list--indent">
	<div class="line-item">
		<check-box-group :options="checkboxList"  @changed="onCheckboxChanged"></check-box-group>
	</div>
	<div class="line-item">
		<check-box-group :options="checkboxList" class="vue-checkbox-group horizontal" @changed="onCheckboxChanged"></check-box-group>
	</div>
	<div class="line-item">
		checked:{{checkedValue|json}}
	</div>
</div>
</div>
</template>

<script>
import checkBoxGroup from "components/checkbox/checkboxgroup"

export default{
	data(){
		return{
	 		checkedValue:"",
	 		checkboxList:[
	 			{
	 				value:"1",
	 				text:"上海"
	 			},
	 			{
	 				value:"2",
	 				checked:"checked",
	 				text:"北京"
	 			},
	 			{
	 				value:"3",
	 				disabled:"disabled",
	 				text:"深圳"
	 			}
	 		]
 		}
 	},
 	components:{
 		checkBoxGroup
 	},
 	methods:{
 		onCheckboxChanged:function(item){
			this.checkedValue=item;
 		}
 	}
}
</script>