element Dialog中嵌套form第一次清除验证问题

//Dialog
 <el-dialog
      title="更新用户信息"
      :visible="showUpdateDialog"
      width="500px"
      :show-close="true"
      :closeOnClickModal="false"
      v-dialogDrag
      @close="onCancelUpdate"
    >
      <el-form
        :model="userInfo"
        :label-width="input_width"
        ref="updateUserinfoForm"
        :rules="userInfoRules"
        status-icon
        :validate-on-rule-change='false'
      >
      </el-from>
</el-dialog> 

//更新信息
updateUserInfo(info) {
   //打印关联的form
   console.log(this.$refs.updateUserinfoForm);
}

问题： 第一打开Dialog ,存着弹窗渲染延迟的问题，所以第一次我们打印的 this.$refs.updateUserinfoForm为 undfined;

解决：

1、如果你的form 是一个空的；（比如添加新内容的表单）

使用方法： 

    

updateUserInfo(info){
 //取消更改form 弹出一次之后的验证
 if (this.$refs.updateUserinfoForm) {
    this.$refs.updateUserinfoForm.resetFields();
 }

 或者(这个方法有时候会有些问题，比如我在nextTick 中 就 使用不了 clearValidate方法)
 this.$nextTick(()=>{
 if (this.$refs.updateUserinfoForm) {
    this.$refs.updateUserinfoForm.resetFields();
 }})
 }

2、方法二：

直接使用一个延迟解决，这个方法也可以解决 change 触发验证行为

    //更新用户信息
    updateUserInfo(info) {
      let that = this
      setTimeout(() => {
        if (that.$refs.updateUserinfoForm) {
           that.$refs.updateUserinfoForm.clearValidate();
        }
      },50);
    },

这个方法我老感觉不是特别完美，比如延迟时间设定多少合适？ 设置0我试也可以。 不过目前能达到我要的效果（第一打开弹框不验证），大家有更好的解决方案，感谢告知。