最近需要用到vue的反選全選功能，於是就在網上找了一些代碼實現，發現都不能夠完美的實現。於是乎決定自己寫出一套。經過一翻努力，完美了進行了實現。bug也已經修復完畢，希望能夠幫助到大家！
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://cdn.bootcss.com/vue/2.6.9/vue.min.js"></script>
<script src="https://cdn.bootcss.com/axios/0.18.1/axios.js"></script>
</head>
<body>
<div id="dd">
<button @click="checkAnti">反選</button>
<button @click="checkAll">全選</button>
<button @click="checkNone">全不選</button>
<table>
<tr v-for="l in list">
<td><input type="checkbox" class="cd" checked="checked" :value="l" v-model="ck"></td>
</tr>
</table>
<span v-text="new Date().getTime()"></span>
{{da}}
{{ck}}
</div>
<script type="text/javascript">
var s = new Vue({
el:"#dd",
data:{
list:[10,22,3,4,5,69,70],
ck:[],
ss:"2019-05-26",
da:new Date("2019-08-12").getTime()
},
methods: {
checkNone() {
this.ck=[]
},
checkAll() {
this.ck=[]
is=this;
this.list.forEach(i=>{
is.ck.push(i)
})
},
checkAnti() {
is = this;
this.list.forEach(item => {
if(is.ck.indexOf(item)!=-1){
is.ck.splice(is.ck.indexOf(item),1);
}else{
is.ck.push(item)
}
})
}
}
})
</script>
</body>
</html>