Vue报错之$nextTick

今天在生产上面出现了一个问题，我们作为一个整个的项目，我们制作的报账系统是其中一个的子系统，但是现在出现了一个问题.
因为我们是共同使用一个前段，而且我们是最先上线的，就导致其他的系统在模仿我们的代码情况，然后他们修改了我们的代码中的公共部分，将本来调用我们接口的部分写成了调用其他系统，我们代码发布是先发到了测试环境，他们的项目没有上线只在测试环境测试，而且因为我们两个接口的功能相似，没有看出问题，然后今天正式环境打开就报错了。
说那么多就是想说一个问题，因为他们是修改的公共组件中的接口，这里就牵扯一个组件中的引用方法，之前的时候我们对待一个组件引用方式。
一般来说
在vue中表明组件

<approvalRecord ref="approvalRecord"
                                    v-show="approvalRecordVisible"></approvalRecord>

然后下面写好方法去调用组件

    commentReload () {
      this.approvalRecordVisible = false
      this.$nextTick(() => {
        this.approvalRecordVisible = true
        this.$refs.approvalRecord.proInsId = this.proInstanceId
        this.$refs.approvalRecord.init()
      })
    },

然后再页面初始化的时候去调用这个方法
但是出现了一个问题，当你在

      this.$nextTick(() => {
        this.approvalRecordVisible = true
        this.$refs.approvalRecord.proInsId = this.proInstanceId
        this.$refs.approvalRecord.init()
      })

中出现了问题，整个组件报错，然后不展示
我看我有一个同事做了一个很有意思的写法

    commentReload () {
      this.approvalRecordVisible = false
      this.approvalRecordVisible = true
      this.$nextTick(() => {
        this.$refs.approvalRecord.proInsId = this.proInstanceId
        this.$refs.approvalRecord.init()
      })
    },

他把控制组件显示的值放在了nextTick的前边，这样即使nextTick里面的内容出现了问题，也会显示组件里面的内容，但是这个的前提不是你获取组件里面的内容的url出现问题，感觉挺有意思的