Element ui关闭el-dialog时如何清除数据
更新时间：2024年02月29日 10:28:40 作者：Temptat14x
这篇文章主要介绍了Element ui关闭el-dialog时如何清除数据问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
element ui关闭el-dialog时清除数据
如果是按叉叉关闭或者点表单以外空白处关闭的话
可以给el-dialog添加
:before-close="closeForm"
在methods里添加函数
closeForm(){
this.$refs.form.resetFields();//清除数据
this.dialogFormVisible=false;//关闭对话框
}如果是按取消按钮清除数据，也可以给取消按钮绑定点击事件，点击取消则调用closeForm函数。
注意：
1.要为每个 form-item 加上 prop 属性，要不然无法清空
2.resetFields() 方法是重置表单，重置为初始值，而不是设置为空值
element ui对话框el-dialog关闭事件,清空填写的数据
通常会有需求，在关闭弹框后需要清空填写的数据，这时候就需要关闭事件了
<el-dialog title="标题" :visible.sync="bind" size="small" @close='closeDialog'> </el-dialog>
在标签中加入@close='closeDialog'
mothods中加入
//关闭弹框的事件
closeDialog(){
this.xxx = '';//清空数据
},总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了浅谈vue 多个变量同时赋相同值互相影响，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
vue的过滤器通常用在一些常见的文本格式化，过滤器可以用在两个地方：双花括号插值和 v-bind 表达式。本文给大家介绍了web前端vue filter 过滤器的相关知识，感兴趣的朋友一起看看吧2018-01-01
这篇文章主要介绍了vue如何实现路由跳转到外部链接界面，具有很好的参考价值，希望对大家有所帮助。2022-10-10
这篇文章主要介绍了vue中的watch监听数据变化及watch中的immediate、handler和deep属性详解，本文大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧2018-09-09
这篇文章主要为大家详细介绍了Vue中使用vux配置的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
这篇文章主要介绍了Vue实例中el和data的两种写法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-11-11
watchEffect，它立即执行传入的一个函数，同时响应式追踪其依赖，并在其依赖变更时重新运行该函数，本文主要介绍了Vue3中watchEffect的具体用法，感兴趣的可以了解一下2022-05-05
这篇文章主要为大家详细介绍了vue实现上传图片添加水印的升级版，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
这篇文章主要介绍了关于ElementUI自定义Table支持render，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
本篇文章主要介绍了vue 里面使用axios 和封装的示例代码，非常具有实用价值，需要的朋友可以参考下2017-09-09
最新评论