使用vue.js实现checkbox的全选和多个的删除功能

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53

<script> var proData = [{    "name" : "j1ax" }, {    "name" : "j2ax" }, {    "name" : "j3ax" }, {    "name" : "j4ax" }] export default {    name: 'hello' ,    data() {      return {        proData: proData,        selectArr: []      }    },    created() {      this .$http.get( '/api/home' ).then( function (response) {        response = response.body;        this .proData = response.data;      })    },    methods: {      del() {        let arr = [];        var len = this .proData.length;        for ( var i = 0; i < len; i++) {          if ( this .selectArr.indexOf(i)>=0) {            console.log( this .selectArr.indexOf(i))          } else {            arr.push(proData[i])          }        }        this .proData = arr;        this .selectArr = []      },      selectAll(event) {        var _this = this ;        console.log(event.currentTarget)        if (!event.currentTarget.checked) {          this .selectArr = [];        } else { //实现全选          _this.selectArr = [];          _this.proData.forEach( function (item, i) {            _this.selectArr.push(i);          });        }      }    } } </script>

转载于:https://www.cnblogs.com/exmyth/p/7885199.html