Vue使用this.$refs.子组件ref. 方法 报错：Cannot read property of undefined 问题

记录问题

在写滑动验证码的时候遇到了以下问题，在此记录一下，如果能够帮到大家，就在好不过了。

问题：vue.runtime.esm.js?2b0e:4605 [Vue warn]: Error in v-on handler: “TypeError: Cannot read properties of undefined (reading ‘reset’)”

描述：每次在点击按钮弹出滑动验证码时，上一次的验证没有清除刷新，于是出现以下情况：

如果想要每次验证的时候都是刷新好的，那么在点击弹出滑动验证码时就需要重置(reset)一下，刚开始是这样写的：

但是发生了上面的错误，只有第一次点击的时候会出现以上错误， 原因是，第一次加载的时候，隐藏的弹出框并没有编译渲染进dom里面，所以第一次点击弹出框的时候没有必要重置，这里可以加一个if语句进行判断。
如下：

这样就不会有报错了，而且每次弹出验证码都是刷新好的。