console
var that;
var app = new Vue({
el: '#app',
data() {
return {
list:[
{
id:1,
name:'列表1'
},
{
id:2,
name:'列表2'
},
{
id:3,
name:'列表3'
},
{
id:4,
name:'列表4'
},
],
check:false,
carList:[]
}
},
methods: {
getCar(){
if(this.check == true){
this.carList = []
this.list.map((item) =>{
this.carList.push(item.id)
});
console.log('全选',this.carList)
}else{
this.carList = []
console.log('取消全选')
}
}
}
});
<div id="app">
<input type="checkbox" v-model="check" @change="getCar">
<span v-if="check">取消全选</span>
<span v-else>全选</span>
<div>选中的元素:{{carList}}</div>
<div v-for="(item,index) in list" :key="index">
<span>{{item.name}}</span>
<input type="checkbox" :value="item.id" v-model="carList">
</div>
</div>