el-dialog关闭后清空表单

您可以在 el-dialog 的 close 事件中，调用表单的 resetFields 方法来清空表单。例如：

<template>
  <el-dialog
    title="编辑用户"
    :visible.sync="dialogVisible"
    @close="handleClose"
  >
    <el-form :model="form" ref="form">
      <!-- 表单项 -->
    </el-form>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      form: {
        // 表单数据
      }
    };
  },
  methods: {
    handleClose() {
      this.$refs.form.resetFields();
    }
  }
};
</script>

这样，每次关闭 el-dialog 时，表单数据都会被清空。

相关问题

element ui中 el-dialog关闭窗口清空表单验证

在element ui中，可以在关闭窗口时通过调用表单的resetFields()方法清空表单验证。例如：

<el-dialog
  :visible.sync="dialogVisible"
  @close="dialogVisible = false; form.resetFields()">
  <el-form ref="form">
    <!-- 表单内容 -->
  </el-form>
</el-dialog>

其中，`form` 是表单的ref名称，可以根据实际需要进行替换。

关闭el-dialog弹窗怎么清空表单内容

关闭el-dialog弹窗可以通过以下两种方式来清空表单内容：

1. 在关闭弹窗之前，手动重置表单数据。可以通过调用表单组件的 resetFields 方法来实现：

this.$refs.formName.resetFields();
this.dialogVisible = false;

2. 通过监听弹窗关闭事件，在关闭弹窗时重置表单数据。可以在弹窗组件的 v-model 绑定的变量上添加一个 change 事件监听器，然后在事件处理函数中重置表单数据：

<el-dialog v-model="dialogVisible" @close="handleClose">
  <!-- 表单内容 -->
</el-dialog>

methods: {
  handleClose() {
    this.$refs.formName.resetFields();
  }
}

以上两种方式都可以实现关闭弹窗时清空表单数据的效果，具体选择哪种方式可以根据实际需求来决定。