vue之watch 深度监听(you may have an infinite update loop in a component render function)

 formInline:{
                    addr:'',
                    ip:'',
                    maskcode:'',
                    routerlist:'',
                    dymaicitems:[
                        {ripaddr:'',rmaskcode:'',rgateway:'',status:1,index:1}
                    ]
                },

有这些一个需求，当我们删除一行的时候，我们不通过删除dymaicitems的元素，而是将对应每一项status设为‘0’,当dymaicitems每一项的status都为0的时候，我们将dymicitems清空。

vue的watch可以监听数据的变化，但watch默认只能监听formInline的变化，要想监听formInline里面的数据变化，我们可以用watch的深度监听

watch: {
            'formInline.dymaicitems':{
                handler:function(){
                    for (let item = 0; item < this.formInline.dymaicitems.length ; item++){
                        this.flag = "1";
                        if (this.formInline.dymaicitems[item].status=='1') this.flag = "2";
                        for (let x = 0; x < this.formInline.dymaicitems.length ; x++){
                            if(this.formInline.dymaicitems[x].status=='1'){
                                this.flag = "2";
                            }
                        }
                    }
                    if (this.flag=="1") {
                        this.formInline.dymaicitems = [];
                        this.flag = "2";
                    }

                },
                deep:true //深度监听
            }
        }

这地方关键点，我们要把flag抽取出来放到data里面定义，否则vue深度监听会一直遍历formInline里面的内容，抛出这样的错误：you may have an infinite update loop in a component render function