用Vue.js实现全选与全不选删除功能

这是实现全选与全不选逻辑的代码，大家只要给相应的控件再加上删除逻辑就完成了全选与选不选、单选等删除功能了；这段代码经过我很多次强暴，是可以用的。

<template> 

<div id="hello">

        <ol>

            <li>

                <span><input type="checkbox" v-model="selectAll"></th></span>

                <span align="left">全选</span>

            </li>

            <li v-for="answer in answers">

                <span>

                <!--:value ===  v-bind:value=""-->

                    <input type="checkbox" v-model="selected" :value="answer.id" >

                </span>

                <span>{{ answer.name }}</span>

            </li>

        </ol>

    </div>

</template>

<script>

import Vue from 'vue'

export default {

  name: 'hello',

  data:function() {

  return{

        answers: [ 

            { "id": 1, "name": "A" },

            { "id": 2, "name": "B" }, 

            { "id": 3, "name": "C" }, 

            { "id": 4, "name": "D" }

        ],

        selected : []

           } },

  computed: {

        selectAll: {

            get: function () {//因为在set方法中改变了全局变量selected，所以get方法会被调用

            console.log("getgetget");

            console.log("this.answers ? ...="+this.answers ? this.selected.length == this.answers.length : false);

            console.log("this.answers="+this.answers);

            console.log("this.selected.length == this.answers.length:"+this.selected.length == this.answers.length);

                return this.answers ? this.selected.length == this.answers.length : false

            },

            set: function (value) {//点击checkbox会自动调用set方法

            console.log("setsetset");

                var selected = [];
console.log("value="+value);

                if (value) {

                    this.answers.forEach(function (user) {

                    console.log("user="+user);

                    console.log("user.value="+user.value);

                    console.log("user.id"+user.id);

                        selected.push(user.id);

                    });

                }

                this.selected = selected;

            }

        },

        selectAll2:{

        get:function(){

        console.log("get");

        },

        set:function(value){

        console.log("value"+value);

       

        }

        }

            }

}

</script>

<style>
</style>