vue项目element-ui问题：“Cannot read property ‘resetFields‘/‘clearValidate‘ of undefined“问题解决

vue项目的在弹窗上的form表单验证，如下

我们需要清楚清除在下一次进入时，需要清楚这些自动校验的结果或者是表单里面的数据

所以我们使用了下面两个方法

//清空表单数据
this.$refs['formName'].resetFields()
//清空校验规则
this.$refs['formName'].clearValidate();

但是，在实际使用中（遇到弹框清空表单报错，自己在做表单校验的时候，打开弹框的时候清空表单出现），会出现如下两个bug

"Cannot read property 'resetFields' of undefined"
"Cannot read property 'clearValidate' of undefined"

原因分析：mouted加载table数据以后，隐藏的 Dialog 并没有编译渲染进 dom 里面，所以当通过点击事件，Dialog 弹出的时候，$refs 并没有获取到 dom 元素导致

解决方法：做一个if判断即可，如下

if (this.$refs['formName'] != undefined){
    
    
  this.$refs['formName'].resetFields();
  this.$refs['formName'].clearValidate();
}

如此，上面的报错便可以完美解决