vue
vue复选框组件自定义对勾-凯发ag旗舰厅登录网址下载
handlecheck(checkedkeys,checkednodes,halfcheckedkeys,halfcheckednodes){var len = 0,num = 0;var _alen = 0;var a =[];var b =[];var copyarr =[];for (var i = 0;i < checkednodes.checkednodes.length;i ){//记录子节点的索引
if (checkednodes.checkednodes[i].children === null) {
len ;
b.push(i)
}//判断是否有全选,如果有,则获取父节点信息的索引
if (checkednodes.checkednodes[i].children != null) {
num ;
a.push(i)
}
}
console.log('num')
console.log(checkednodes.halfcheckedkeys)
console.log(num)
console.log('a')
console.log(a)//如果都是半选状态
if ( num === 0) {//将全是半选的模式设置为1
this.flag = 1
//将父节点信息和子节点信息加入到param数组中(这个数组与后台数据交互)
this.param =[]
let _pollutant={}this.pollutant.projectid = this.iddthis.pollutant.subcateid = checkednodes.halfcheckedkeys[checkednodes.checkedkeys.length-1]this.pollutant.cateid = checkednodes.checkedkeys[checkednodes.checkedkeys.length-1]
object.assign(_pollutant,this.pollutant)this.param.push(_pollutant)
console.log('半选状态')
console.log(this.param)
}//如果都是全选状态
if (num > 0 && checkednodes.halfcheckedkeys.length === 0) {//如果由半选进入全选状态,则将数组置空,然后将该父节点下的所有子节点放入数组中
if (this.flag === 1)this.param =[]//如果由混合进入全选状态,这时如果将这个父节点的所有子节点加入数组则会有重复数据,这时需要删除之前多加的数据
if (this.flag === 3) {this.param.splice(this.param.length-1,1)
}//获取最新父节点的索引以及该父节点的长度
_alen= a.length-1;var length =checkednodes.checkednodes[a[_alen]].children.length;
console.log(length)//最新父节点下的所有子节点放到数组
for (var j = 0;j
let _pollutant={}this.pollutant.projectid = this.iddthis.pollutant.subcateid =checkednodes.checkednodes[a[_alen]].idthis.pollutant.cateid =checkednodes.checkednodes[a[_alen]].children[j].id
object.assign(_pollutant,this.pollutant)this.param.push(_pollutant)
}
console.log('全选状态')
console.log(this.param)//将当前全选状态设置为2
this.flag = 2;
}//如果是全选和半选都有
if (num > 0 && checkednodes.halfcheckedkeys.length != 0) {
console.log(checkednodes.checkednodes)
console.log(checkednodes.halfcheckednodes)
_alen= a.length - 1console.log(a[_alen])//如果之前操作全是半选模式 或者是混合模式 ,则将全选的再加入数组
if (this.flag === 1 || this.flag === 3) {var length =checkednodes.checkednodes[a[_alen]].children.length;for (var j = 0;j
let _pollutant={}this.pollutant.projectid = this.iddthis.pollutant.subcateid =checkednodes.checkednodes[a[_alen]].idthis.pollutant.cateid =checkednodes.checkednodes[a[_alen]].children[j].id
object.assign(_pollutant,this.pollutant)this.param.push(_pollutant)
}
}
console.log(this.flag)
console.log('flag')//将全选之后的节点放到数组中//如果之前操作全是全选,则将半选的再加入数组
if (this.flag === 2) {
console.log('cnlen')var cnlen = a[_alen] checkednodes.checkednodes[a[_alen]].children.length 1console.log(cnlen)
console.log(checkednodes.halfcheckedkeys.length)for (var i = cnlen;i < checkednodes.checkednodes.length; i ) {
let _pollutant={}this.pollutant.projectid = this.iddthis.pollutant.subcateid = checkednodes.halfcheckedkeys[checkednodes.halfcheckedkeys.length-1]this.pollutant.cateid =checkednodes.checkednodes[i].id
object.assign(_pollutant,this.pollutant)this.param.push(_pollutant)
}
}
console.log('全选和半选')
console.log(this.param)this.flag = 3}
},
总结
以上是凯发ag旗舰厅登录网址下载为你收集整理的vue复选框组件自定义对勾_vue element:树级复选框组件使用的全部内容,希望文章能够帮你解决所遇到的问题。
如果觉得凯发ag旗舰厅登录网址下载网站内容还不错,欢迎将凯发ag旗舰厅登录网址下载推荐给好友。
- 上一篇:
- 下一篇: