问题:

    elementui在重置表单时,无法使用this.$refs['formRefVal'].resetFields()清空表单数据;
elementui 设置rules后没有效果 解决方法: 1、表单加ref属性 <el-form ref="refname"></el-form> 2、form的每个item加prop属性(踩了好久的坑这个,需要和绑定数据的最后名称一致,prop属性添加到form-item上) <el-form-item prop="name">
<el-input v-model="query.name"></el-input>
</el-form-item> 3、绑定点击事件中传入refname <el-form-item>
<el-button @click="resetForm('refname')">清空</el-button>
</el-form-item> 4、注册事件 restForm(refname) {
this.$refs[refname].resetFields()
} + 5、检查是否有初始值
在data数据上需要挂载表单数据初始值为'' 如果使用了$store.state.fm.plan管理关联表单数据,那么在form中需要添加:model="$store.state.fm"。

vue + elementui表单重置 resetFields问题(无法重置表单)的更多相关文章

  1. Vue + Element-ui实现后台管理系统(5)---封装一个Form表单组件和Table表格组件

    封装一个Form表单组件和Table组件 有关后台管理系统之前写过四遍博客,看这篇之前最好先看下这四篇博客.另外这里只展示关键部分代码,项目代码放在github上: mall-manage-syste ...

  2. Vue + ElementUI的电商管理系统实例01 登录表单

    效果图: 1.首先来根据Element网站实现布局: <template> <div class="login_container"> <div cl ...

  3. vue + ElementUI 关闭对话框清空验证,清除form表单

    前面跟大家提到过 elementUI验证的问题,那么今天就来看看 点击对话框和关闭按钮 怎么清空验证,清空form表单,避免二次点击还会有 验证错误的提示 1.首先在你的对话框 取消按钮 加一个cli ...

  4. Vue Element-ui 框架:路由设置 限制文件类型 表单验证 回车提交 注意事项 监听事件

    1.验证上传文件的类型: (1)验证图片类型 <template> <el-upload class="avatar-uploader" action=" ...

  5. vue + elementui form resetFields方法 无法重置表单

    this.$refs['form'].resetFields(); 方法无法重置.1 el-form 组件 没有添加 ref 属性 <el-form ref="form" : ...

  6. vue elementui form表单验证

    最近我们公司将前端框架由easyui 改为 vue+elementui .自学vue两周 就开始了爬坑之路.业余时间给大家分享一下心得,技术新手加上第一次分享(小激动),有什么不足的地方欢迎大家指正, ...

  7. vue elementUI 表单校验(数组多层嵌套)

    在使用vue element-ui form表单渲染的时候,会遇到这样的数据结构: { "title":''123455, "email":'123456@qq ...

  8. Java快速开发平台强大的代码生成器,JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布

    JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布 此版本为Vue+ElementUI SPA单页面应用版本,提供新一代风格代码生成器模板,采用Vue技术,提供两套精美模板E ...

  9. v-if案例解析(element-ui form-item 结合 v-if 动态生成rule规则\表单元素,表单无法验证问题剖析 )

    fire 读在最前面: 1.此文章衔接Vue 虚拟Dom 及 部分生命周期初探,相关整体知识点请先阅读后再继续本文阅读 问:当v-if为true时,会重新渲染相关dom节点吗? <child v ...

  10. ElementUI表单验证攻略:解决表单项启用和禁用验证的切换,以及动态表单验证的综合性问题

    试想一种比较复杂的业务场景: 表格(el-table)的每一行数据的第一列是勾选框,最后一列是输入框.当某一行的勾选框勾上时,启用该行的输入框,并开启该行输入框的表单验证:取消该行的勾选框,则禁用该行 ...

随机推荐

  1. Json与Ajax(注册实例)

    需要在服务器上进行哈 jquery的ajax方法: // jquery请求 $.ajax({ url: "./server/slider.json", type: "po ...

  2. ng-辅助操作

    创建组件,指令,过滤器和服务 # 创建组件 ng generate component my-new-component # 创建组件别名 ng g component my-new-componen ...

  3. 任意指定一个key获取该key所处在哪个node节点

    需求:任意指定一个key获取该key所处在哪个node节点上. 说明:redis自带的命令可以知道一个key所属的slot,可以知道node master对应哪些slot,但没有key和node的对应 ...

  4. leetcode四道组合总和问题总结(39+40+216+377)

    39题目: 链接:https://leetcode-cn.com/problems/combination-sum/ 给定一个无重复元素的数组 candidates 和一个目标数 target ,找出 ...

  5. Win10如何设置休眠选项(关于睡眠、休眠、快速启动这几个伪关机功能如何设置更适合笔记本电脑?)

    · Win10如何设置休眠选项(关于睡眠.休眠.快速启动这几个伪关机功能如何设置更适合笔记本电脑?) 应用场景 升级正式版win10以后,发现竟然没有休眠选项,从电源管理器里面也没有找到,有时候有些重 ...

  6. NPOI 生成Excel

    private void btnSave_Click(object sender, EventArgs e) { ) != ".xls") { MessageBox.Show(&q ...

  7. ubuntu设置ulimit

    centos系统的设置ulimit的时候是直接修改/etc/security/limits.conf文件,但是在ubuntu中却不行, ubuntu先修改/etc/security/limits.co ...

  8. 反射_python

    一.反射(通过字符串的形式去操作对象中的成员) 1.getattr:获取对象中的字段和方法 2.hasattr:判断对象里面是否有字段或方法 3.setattr:设置对象里面的字段或方法 4.dela ...

  9. 题解【AcWing279】自然数拆分

    题面 因为题目中说参与加法运算的数可以重复,由此可以想到完全背包计数问题. 完全背包计数问题与 \(01\) 背包计数问题只有一个不同: \(01\) 背包计数问题的第二维循环是倒叙循环,而完全背包计 ...

  10. Python之路Day11

    函数名的第一类对象及使用 当作值,赋值给变量 def func(): print(1) print(func) #查看函数的内存地址 a=func print(a) a() 可以当作容器中的元素 de ...