vue3 + elementPlus reset重置表单问题
更新时间：2022年05月27日 09:33:37 作者：jefferylong
这篇文章主要介绍了vue3 + elementPlus reset重置表单问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
vue3 elementPlus reset重置表单
表单需加上ref属性
字段需加上prop属性
<template> <div class="main"> <el-form ref="resetFormData" :model="formInline"> <el-form-item label="姓名" prop="customerName"> <el-input v-model="formInline.customerName" placeholder="请输入姓名" ></el-input> </el-form-item> <el-button type="warning" @click="resetForm">重置</el-button> </el-form> </div> </template>
<script>
import { defineComponent, reactive, ref } from "vue";
export default defineComponent({
setup() {
const resetFormData = ref(null);
const formInline = reactive({});
const resetForm = () => {
resetFormData.value.resetFields();
};
return {
resetForm,
resetFormData,
formInline,
};
},
});
</script>vue3 elementPlus 踩坑
表单重置按钮resetForm失效
在项目过程中按照之前的经验写重置按钮时发现不生效，换了原生的重置按钮也不行。后来发现还是版本移植的问题。
vue2.0和vue3.0的语法不一样，在main.js中引入resetform函数时语法出错
// Vue2.0 Vue.prototype.resetForm = resetForm; //Vue3.0 let app = createApp(App); //... app.config.globalProperties.resetForm = resetForm;
还是要多看官方文档啊！！
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
Vue实现导出Excel表格文件提示“文件已损坏无法打开”的解决方法
xlsx用于读取解析和写入Excel文件的JavaScript库,它提供了一系列的API处理Excel文件,使用该库,可以将数据转换Excel文件并下载到本地,适用于在前端直接生成Excel文件,这篇文章主要介绍了Vue实现导出Excel表格,提示文件已损坏,无法打开的解决方法,需要的朋友可以参考下2024-01-01
本文详细介绍了如何在Vue应用中使用xlsx库来导出Excel文件,包括安装xlsx库、准备数据、创建导出方法、触发导出操作和自定义Excel文件等步骤,xlsx库提供了强大的API和灵活的自定义选项,使得处理Excel文件变得简单而高效2024-10-10
这篇文章主要介绍了用electron 打包发布集成vue2.0项目的操作步骤,把electron 加入到自己项目中各种不兼容，升级版本踩坑无数个，今天通过本文给大家分享下详细过程，需要的朋友可以参考下2022-10-10
今天在项目中有一个功能是要求显示北京的实时时间,下面这篇文章主要给大家介绍了关于如何基于Vue的前端界面实现日期时间实时显示的相关资料,需要的朋友可以参考下2024-01-01
详解vue-router 2.0 常用基础知识点之router-link
这篇文章主要介绍了详解vue-router 2.0 常用基础知识点之router-link，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
vue计算属性computed、事件、监听器watch的使用讲解
今天小编就为大家分享一篇关于vue计算属性computed、事件、监听器watch的使用讲解，小编觉得内容挺不错的，现在分享给大家，具有很好的参考价值，需要的朋友一起跟随小编来看看吧2019-01-01
这篇文章主要介绍了Vue+tracking.js 实现前端人脸检测功能,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-04-04
这篇文章主要为大家介绍了Vue之常用的内置指令，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2021-11-11
距离 Vue 3.0 正式版发布已经有一段时间了,关于vue3组件库相关的问题还是挺多人感兴趣的,这篇文章主要给大家介绍了关于vue3如何按需加载第三方组件库的相关资料,需要的朋友可以参考下2021-06-06
这篇文章主要为大家详细介绍了vue中自定义右键菜单插件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
最新评论