element ui form resetfields
时间: 2023-10-10 08:08:05 浏览: 95
Element UI 的 Form 组件提供了一个 `resetFields` 方法,用于重置表单的所有字段为初始值。
具体使用方法如下:
1. 在组件中引入 Form 组件和 Button 组件:
```vue
<template>
<div>
<el-form :model="form" ref="myForm">
<!-- 表单项 -->
</el-form>
<el-button type="primary" @click="resetForm">重置表单</el-button>
</div>
</template>
<script>
import { Form, Button } from 'element-ui';
export default {
components: {
ElForm: Form,
ElButton: Button,
},
data() {
return {
form: {
// 表单数据
},
};
},
methods: {
resetForm() {
this.$refs.myForm.resetFields(); // 调用重置方法
},
},
};
</script>
```
2. 在方法中调用 `resetFields` 方法:
```javascript
this.$refs.myForm.resetFields();
```
这样,点击重置按钮时,表单的所有字段将会被重置为初始值。
阅读全文