vue3 setup const wlanForm = ref<FormInstance>(); 引用报错resetFields [ElForm] model is required for resetFields to work
时间: 2024-03-06 17:50:30 浏览: 76
vue-router 按需加载 component: () => import() 报错的解决
5星 · 资源好评率100%
这个错误提示和之前的一样,也是由于在调用 `resetFields` 方法时未提供 `ElForm` 的 `model` 属性所导致的。为了解决这个问题,你需要在 `ElForm` 组件上添加 `model` 属性,例如:
```html
<template>
<el-form :model="formValues" ref="wlanForm">
<!-- 表单项 -->
</el-form>
</template>
<script>
import { ref } from 'vue';
import { FormInstance } from '@/types/components/ElForm';
export default {
setup() {
const formValues = ref({});
const wlanForm = ref<FormInstance>(null);
const resetForm = () => {
if (wlanForm.value) {
wlanForm.value.resetFields();
}
};
return {
formValues,
wlanForm,
resetForm,
};
},
};
</script>
```
在上面的代码中,我们在 `ElForm` 组件上添加了 `model` 属性,并将其设置为 `formValues` 变量。同时,我们将 `ElForm` 组件的引用保存在了 `wlanForm` 变量中,以便在调用 `resetFields` 方法时使用。这样,在调用 `resetFields` 方法时,`ElForm` 组件就能够正确地重置表单的值了。
阅读全文