element-ui重置resetFields()不生效的解决

 更新时间:2023年12月13日 08:31:54   作者:禾火r  
本文主要介绍了element-ui重置resetFields()不生效的解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

初始化数据

data() {
	  return {
	  	   dialogVisible: false,
	       form: {
	           name: '',
	           age: '',
	           sex: '',
	           birth: '',
	           addr: ''
	       }
	   }
	}

弹窗关闭重置数据

handleClose() {
    // 弹窗关闭的时候清除数据
    this.$refs.form.resetFields()
    this.dialogVisible = false
}

以上操作this.$refs.form.resetFields()未生效 直接强制变值,死马当活马医

初始化数据

data() {
	  return {
	  	   dialogVisible: false,
	       form: {
	           name: '',
	           age: '',
	           sex: '',
	           birth: '',
	           addr: ''
	       },
	       resetForm: {
	       	   name: '',
	           age: '',
	           sex: '',
	           birth: '',
	           addr: ''
	       }
	   }
	}

弹窗关闭重置数据

handleClose() {
    // 弹窗关闭的时候清除数据
    this.form = this.resetForm
    this.dialogVisible = false
}

到此这篇关于element-ui重置resetFields()不生效的解决的文章就介绍到这了,更多相关element重置resetFields()不生效内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Ant Design of Vue的树形控件Tree的使用及说明

    Ant Design of Vue的树形控件Tree的使用及说明

    这篇文章主要介绍了Ant Design of Vue的树形控件Tree的使用及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • Vue3.2 新增指令 v-memo 用法详解(提高性能利器)

    Vue3.2 新增指令 v-memo 用法详解(提高性能利器)

    v-memo 接受一个依赖的数组,依赖的数组变化,v-memo 所对应的 DOM 包括子集将会重新渲染,这篇文章主要介绍了Vue3.2 新增指令 v-memo 用法,提高性能的又一利器,需要的朋友可以参考下
    2022-09-09
  • Vue3+vite创建项目方式

    Vue3+vite创建项目方式

    本文介绍了如何使用Vite创建Vue项目,包括版本升级、命令变化以及配置vue-router、Vuex和AntDesignVue的方法,同时,也提供了降级Vue CLI以兼容Vue2项目的步骤
    2024-12-12
  • 详解Vue组件之间的数据通信实例

    详解Vue组件之间的数据通信实例

    本篇文章主要介绍了详解Vue组件之间的数据通信实例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • vue3+elementPlus table中添加输入框并提交校验

    vue3+elementPlus table中添加输入框并提交校验

    这篇文章主要介绍了vue3+elementPlus table里添加输入框并提交校验,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-08-08
  • Element-UI中Upload上传文件前端缓存处理示例

    Element-UI中Upload上传文件前端缓存处理示例

    这篇文章主要介绍了Element-UI中Upload上传文件前端缓存处理示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-02-02
  • 详解Vue开发网站seo优化方法

    详解Vue开发网站seo优化方法

    这篇文章主要介绍了Vue开发网站seo优化方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-05-05
  • vue实现双向绑定和依赖收集遇到的坑

    vue实现双向绑定和依赖收集遇到的坑

    这篇文章主要介绍了vue的双向绑定和依赖收集,主要是通过Object.defineProperty() 实现双向绑定,具体思路代码大家跟随小编一起看看吧
    2018-11-11
  • vue动态路由刷新失效以及404页面处理办法

    vue动态路由刷新失效以及404页面处理办法

    作为一个前端新手,项目中遇到权限处理时,通常会采用动态添加路由的方法来实现,下面这篇文章主要给大家介绍了关于vue动态路由刷新失效以及404页面处理办法的相关资料,需要的朋友可以参考下
    2023-11-11
  • vue点击标签切换选中及互相排斥操作

    vue点击标签切换选中及互相排斥操作

    这篇文章主要介绍了vue点击标签切换选中及互相排斥操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-07-07

最新评论