关闭对话框 清除验证信息

关闭对话框 清除验证信息

点击关闭窗口 页面后 同时清除验证信息 再次打开不会再次出现

方法：

   <div slot="footer" class="dialog-footer">
　　   <el-button @click="callOf('addGroupData')">取 消</el-button>
        <el-button type="primary" @click="addgroupList('addGroupData');">确 定</el-button>
    </div> 

• 1 ·给取消按钮添加一个点击事件 并传个 ref绑定的 参数
  点击事件 关闭窗口 清除验证信息

  callOf('addGroupData'){
    this.$refs[addGroupData].resetFields();
    }
  

  注释： addGroupData form中添加 ref属性， 即ref=“addGroupData”
  可能出现的问题：
  会报： ‘resetFields’ 没有定义

  **原因可能是：**Dom 元素加载的顺序问题

    callOf('addGroupData'){
    this.$nextTick(() => {
      this.$refs[addGroupData].resetFields();
      )}
      }
  

• `2 点击窗口叉号不会清除

   <div slot="footer" class="dialog-footer"  :before-close="closeDialog">
　　   <el-button @click="callOf('addGroupData')">取 消</el-button>
        <el-button type="primary" @click="addgroupList('addGroupData');">确 定</el-button>
    </div> 

可以把 “:close-on-click-modal=“false” 写个点击之前事件i :before-close="closeDialog”

closeDialog（done）{
　this.$confirm('确认关闭？')
　　.then(_ => {
    　　done();
        location.reload(); // 刷新页面
    })
    .catch(_ => { });
}

注释： 这样是会每次都要重新刷新整个页面 效果不太好

• 可以直接使用取消按钮的点击 方法 调用ref 再次使用清除
• 给其绑定个@close关闭事件
• 传入一个 ref 绑定的 参数
• 在方法中接收传的参数

   <div slot="footer" class="dialog-footer"  @close="closeDialog（‘addGroupData’）">
　　   <el-button @click="callOf('addGroupData')">取 消</el-button>
        <el-button type="primary" @click="addgroupList('addGroupData');">确 定</el-button>
    </div> 

closeDialog（form）{
　 if(form){
	this.$refs[form].resetFields()
  }
}

清空已上传的照片：

ref="upload"
this.$refs.upload.clearFiles()