iview table 数据勾选功能的实现

最近在做新系统的增删改查     样式通过勾选table列表数据 然后进行修改或者删除

在修改的时候要限制勾选的条数  在网上找了一些方法  说是用原生的 this.$refs.selection.selectAll(status)

由此来获取选中的数据  结合项目实际 每个table都是对原有的table进行的封装然后引用 相当于是父子页面的方法

但是上面的方法是直接指定table的ref然后才能使用 ref="selection"  这样的话在父组件里面不知道怎么指ref并且动态的传给子组件（不同于给组件传值那么简单）

后来看到了官网的table数据选择的事件@on-selection-change（此处有坑刚开始用了@on-select，选中某一项触发，返回值为 selection 和 row，分别为已选项和刚选择的项）

然后将选中的数据存储到集合里面  这个就可以动态获取选中的数据项  （之前用@on-select不是动态的，不能识别选中取消的操作）

但是on-selection-change就封住的恰到好处，能获取到实时勾选的数据，只要选中项发生变化时就会触发，相当于是一个监听

下面是存储选中数据方法

            //多行选中取数
            selectedItems(){
                var selectItems = [];
                Object.keys(this.$refs.dptable.objData).forEach(key => {
                    var item = this.$refs.dptable.objData[key];
                    if(item._isChecked===true){
                        var obj = new Object;
                        Object.keys(item).forEach(ky => {
                            obj[ky] = item[ky];
                        });
                        selectItems.push(item);
                    }
                })

              this.$emit(‘rowCheck’,selectItems)//此处调用父页面的方法将选框的值实时传给父页面，这样就实现了动态获选选框的数据
                return selectItems;
            },