美文网首页react native bug集锦
rn中&&导致的死循环

rn中&&导致的死循环

作者: IDO0 | 来源:发表于2017-09-06 11:14 被阅读18次

需求:
要做一个批处理的列表,选中的item状态改变 并且提交到后台,刷新界面。
bug:
这个bug比较奇葩,会导致死循环。


xunhuan.png

代码:

    renderItem = ()=>{
        if(!this.state.list){
            return null;
        }
        let arr = [];
        for(let i=0;i<this.state.list.length;i++){
            let ischoose = false;
            for(let j=0;j<this.state.arr&&this.state.arr.length;j++){
                // console.log('执行了这里'); 这里注释掉 不会死循环但是显示不正确 会有bug
                if(this.state.list[i].id===this.state.arr[j]){
                    ischoose = true;
                    console.log('执行了这里');
                    break;
                }
            }
            arr.push(<Item
                key = {i}
                ischoose = {ischoose}
                choose = {this.choose}
                rowData={this.state.list[i]}/>)
        }
        return arr;
    };

fix:
给数组一个初始化,删除&&这个就好。

    renderItem = ()=>{
        if(!this.state.list){
            return null;
        }
        let arr = [];
        for(let i=0;i<this.state.list.length;i++){
            let ischoose = false;
            for(let j=0;j<this.state.arr.length;j++){
                if(this.state.list[i].id===this.state.arr[j]){
                    ischoose = true;
                    console.log('执行了这里');
                    break;
                }
            }
            arr.push(<Item
                key = {i}
                ischoose = {ischoose}
                choose = {this.choose}
                rowData={this.state.list[i]}/>)
        }
        return arr;
    };

原因:
为了寻找原因执行如下代码

   console.log('this.state.arr&&this.state.arr.length',this.state.arr&&this.state.arr.length);
        let index = 1;
        if(index<this.state.arr&&this.state.arr.length){
            console.log('小于');
        }else{
            console.log('不小于');
        }

打印


log.png

发现

 if(index<this.state.arr&&this.state.arr.length){

这个比较是不正确的。
然后再次修改执行这段代码

   console.log('this.state.arr&&this.state.arr.length',this.state.arr&&this.state.arr.length);
        let l = this.state.arr&&this.state.arr.length;
        let index = 1;
        if(index<l){
            console.log('小于');
        }else{
            console.log('不小于');
        }

这样就可以正常比较了


log2.png

总结:
当在循环中使用&&判断是否为空时最好小心,
可以使用初始化代替 护着使用变量赋值的方式代替。

相关文章

网友评论

    本文标题:rn中&&导致的死循环

    本文链接:https://www.haomeiwen.com/subject/lttadxtx.html