el-form组件提供了一个resetFields方法,用于重置表单的所有字段。

使用方法如下:

  1. 在el-form组件上添加ref属性,以便在Vue实例中引用该组件。
<el-form ref="myForm">
  <!-- 表单字段 -->
</el-form>
  1. 在Vue实例中通过$refs属性获取el-form组件的引用,并调用resetFields方法。
methods: {
  resetForm() {
    this.$refs.myForm.resetFields();
  }
}

调用resetFields方法后,el-form组件会将所有表单字段的值重置为初始值,并清除所有验证状态。

可以将resetForm方法与一个按钮的点击事件绑定,以实现重置功能。

<template>
  <el-button @click="resetForm">重置</el-button>
</template>
methods: {
  resetForm() {
    this.$refs.myForm.resetFields();
  }
}

这样,当点击"重置"按钮时,el-form组件的所有字段都会被重置

el-form重置功能

原文地址: https://www.cveoy.top/t/topic/ib6W 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录