element

2024-07-17 05:31| 来源: 网络整理| 查看: 265

element-ui form表单校验重置表单踩得一个小坑

着急的话直接看文章底总结前言，给form表单加了rules校验后，提交表单前进行字段检查

this.$refs[formName].validate( valid => { // validate接受两个参数，具体参考element官网api文档，第一个是boolean值 if(valid) { // 为true时，说明表单校验通过，符合rules }else { // 不满足时的逻辑处理 } }

然后提交前检查完事

打开表单窗口时，上次的检查提示还在，因为偷懒没写form表单重置，那就加上吧

this.$refs[formName].resetFields(); // 分割线 ------------------------------------------ // 因为form表单绑定的对象值，我在data里定义时只写了一个空对象 insertData: {}

这里出现问题了，其实还是因为懒，所以开发懒不得

解决办法

所以出现了resetFields()之后，表单无法输入的问题，解决办法就是，把所有字段名在data里面定义的时候全部初始化出来,然后就解决了，自闭一秒，骂自己一秒后继续懒着，因为懒着好舒服啊，出现bug了还能学习到新的东西，所以懒 === yyds

data() { return { insertData: { name1: '', name2: '', name3: '', name4: '', } } }

【本文地址】

element

element

今日新闻

推荐新闻