vue element实现双向校验

最近在做一个有关商品的管理系统，有关商品价与会员价需要一个双方相互校验的功能，商品价不能小于会员价，会员价不能大于商城价，当有错误提示时修改任一方满足条件时均可消除提示信息。

没有从官方文档上找到相关信息，然后通过查找得知可以通过调用ref实例上绑定的验证方法来实现，代码如下：

    if(Number(value) <= Number(this.form.price)){
        this.$refs.form.validateField('price');
    }
    if(Number(value)>Number(this.form.vipPrice)){
        this.$refs.form.validateField('vipPrice');
    }

测试一下，效果ok，然后 ...... ？

    Maximum call stack size exceeded

出现了以上错误。进入element打个断点看下：发现这样写会造成死循环（相互调用，很容易理解）； 怎么办？加个全局参数做下判断，同时只允许一个判断发生作用。代码如下：

    if(Number(value)>Number(this.form.vipPrice)&&this.checkFlag){
      this.checkFlag=false;
      this.$refs.form.validateField('vipPrice');
      this.checkFlag=true;
    }
    if(Number(value) <= Number(this.form.price)&&this.checkFlag){
        this.checkFlag=false;
        this.$refs.form.validateField('price');
        this.checkFlag=true;
    }

checkFlag默认为true，没问题了。