在做treebox往选中的数据中丢数据的时候,发现splice有一个新的缺陷。
1、常规用法介绍
现在先按照常理介绍一下数组提供的splice用法。
arrayObject.splice(index,howmany,item1,.....,itemX)
解析:
index,操作的标签,指定删除或者添加节点的位置
howmany,操作的个数,若为0,则不需要删除
item1,……,itemx,需要添加的值
案例:
var a=[1,2,3];
a.splice(1,0,[4,5]);//[1,2,3,4,5]
a.splice(2,1)//[1,2,4,5]删除index为2的1个数据
a.splice(3,1,7)//[1,2,4,7]删除index为3的1个数据,并在后面添加一个数据
2、特殊介绍及案例
在数组操作中splice删除数据的时候,有这样一种情况,利用splice在循环遍历删除时,会出现删除不完全,漏删指定数据的情况。
案例:
//在状态机初始化时,定义checkedNode
this.state = {
checkedNode: [
{ 'checked': true,
'id':1,
'title':'小数'
}],
//onCheck是往treebox中添加选中节点或者删除选中节点的函数
onCheck = (checkedKey, e) => {
//先不判断节点的checked是否选中,直接丢到选中节点当中,即下面的push操作
this.state.checkedNode.push(
{'checked': e.checked,
'id': e.node.props.dataRef.knowid,
'title':e.node.props.dataRef.title
})
/*再然后执行循环筛选出目前选中节点的的checked,即e.checked,若为false,则通过splice删除checkedNode中的所有e.id的节点*/
for (let i = this.state.checkedNode.length; i >=0 ; i--) {
/*之所以要倒着遍历,是因为如果采用从前往后遍历的话,一个数组[1,2,3]通过splice删除index为0的数据之后,再次回到for循环,之前index为1的数据变为了便成为了index为0的数据,这样便少遍历了数据。*/
/*若倒着遍历,便可避开这个问题,对应数据即使删除了,也不会产生前移的问题。*/
if (e.node.props.dataRef.knowid == this.state.checkedNode[i].knowid) {
if(e.checked==false){
//若采用这种方式删除,数据不会前移
this.state.checkedNode.splice(i,1);
}
}
}
}