当前位置:网站首页>新建和编辑共用一个表单,编辑之后新建,form表单resetFields失效
新建和编辑共用一个表单,编辑之后新建,form表单resetFields失效
2022-07-29 15:40:00 【前端小白۞】
新建和编辑共用一个表单,编辑之后新建,form表单resetFields失效
(1)如果新建的字段只有几个,编辑的时候row有很多字段,这时使用赋值的方法清空。
this.formValidate={
name:undefined,
isAlone:undefined,
expireDate:undefined,
expireCount:undefined
}
this.$refs.formValidate.resetFields()//清除校验规则
或者
this.formValidate={}
this.$refs.formValidate.resetFields()
注意:如果使用resetFields方法清空,虽然可以清空,但是在先编辑再新建时,提交的字段会有很多,而且都是编辑的那一行的数据。
即使加上this.$nextTick(()=>{})也会有同样的问题,所有直接使用赋值的方法清空。
(2)如果新建和编辑的字段有些是可以显示隐藏的
这里需要清空的话,使用v-show
因为:
v-if="false"会销毁dom,当再次v-if="true"时会绑定不上 校验规则 和 需要清空的字段(初始值)。
v-show 只是css样式的显示隐藏,都已经被绑定在dom上,不会被销毁。
但是:
v-show隐藏的字段,仍然会校验不通过,v-if可以校验通过
总结:
(1)有显示隐藏,并且显示隐藏的字段需要验证:使用v-if
(2)有显示隐藏,显示隐藏字段不需要验证:v-if/v-show都可
使用v-if配合手动赋值清空再配合 this.$refs.formValidate.resetFields()//清除校验规则就可以全部情况都正常显示。
边栏推荐
- Twin all things digital visual | join the real world and the digital space
- 基于全志D1-H和XR806的名贵植物监控装置
- 【GoLang】Sync lock
- Face key point prediction and normalization
- NTP服务器搭建
- Win11 最新补丁更新破坏了任务栏中的“开始”菜单
- 【微服务】 微服务学习笔记二:Eureka注册中心的介绍及搭建
- Linux environment redis complete configuration and startup command
- 浏览器线程
- 我把小程序搬到了自有App中,开发效率提升了5倍
猜你喜欢
随机推荐
MLX90640 红外热成像仪开发笔记(九)
高通发布全新屏下指纹传感器:识别区域增大77%,识别速度提升50%
uni-app深入学习之模板运用
See you in shenzhen!Cloud native to accelerate the application building special: see cloud native FinOps, SRE, high-performance computing scenario best practices
专访亚信科技张桦:AntDB面向企业核心业务支撑的数据库产品
Linux environment redis complete configuration and startup command
string 保留小数点后两位(js中保留小数点后两位)
网络知识大集合(最详细)与网络通信过程
Twin all things digital visual | join the real world and the digital space
微信公众号借助小程序云函数实现支付功能
货比三家 tb1.3
易基因:人类tRNA基因位点表现出与衰老相关的DNA高甲基化|研究文章
[MySQL] 排序与分页
风格迁移篇----艺术风格转换的内容与风格解构
数商云SCM供应链系统方案服务亮点:生产管理更智能、产业供应链协同管理更便捷
面试官:设计原则有哪些?什么是里式替换原则?
【小程序项目开发-- 京东商城】uni-app之商品列表页面 (上)
AI全流程开发难题破解之钥
一文读懂Elephant Swap,为何为ePLATO带来如此高的溢价?
CAN报文:数据帧详解









![[MySQL] 运算符](/img/0b/e974cb461fc403de18545f7f9ac527.png)