三个checkbox选择框:
<!-- 多选框 --> 多选框
<input type="checkbox" name="a" id="a" value='a' @change="check" >a
<input type="checkbox" name="b" id="b" value='b' @change="check" >b
<input type="checkbox" name="c" id="c" value='c' @change="check" >c
<!-- 单选框 -->单选框
<input type="radio" name='1' id="1" value="1" checked="true" @change="radio"> 1
<input type="radio" name='1' id="2" value="2" @change="radio"> 2
<input type="radio" name='1' id="3" value="3" @change="radio"> 3
<div>
<span v-for="(i,index) in params" :key="index">{{i}}</span>
</div>
单选框的值:{{radio_value}}
data中的参数:(当点击某一个checkbox时改变对应的对象属性值)
params:[
{'a':false},
{'b':false},
{'c':false}
],
radio_value:'1',
// 点击radio的时候触发radio方法(该方法在methods中)
radio(e){
this.radio_value = e.srcElement.value
},
// 点击checkbox的时候触发check方法(该方法在methods中)
check(e){
var flag = e.srcElement.id
var arr = this.params.map(item=>{
if(Object.keys(item)[0]==flag){
item[flag] = e.srcElement.checked
}
return item;
})
this.params = arr
}