公司项目重构，经过商定使用element ui。在重构项目的时候发现一下element ui上很蛋疼的东西。
例如，这个form表单就是一个。趁着在高铁上没事，把想写的东西写一下。
先说一下element ui提交form表单的时候，如果没有进入我们预想的代码流程，一般就是你写的自定义验证规则有误。
例如如下代码。验证镜像的名称是否重复的一个方法。每个if-else都需要有内容。如若满足就要有一个callback()。
反正我是被这个地方给坑了，之前写代码，一般就是if满足条件之后怎么怎么样，这次必须return 一下内容
let that = this; var checkName = function (rule, value, callback) { let re = /^[A-Za-z0-9_\.\-\u4e00-\u9faf]+$/; if (!value) { callback(new Error(‘该字段为必填项‘)); } else { if (re.test(value)) { let url = that.prefix + ‘/yr_images/create_image/‘; let data = { is_check_name: 1, name: value }; that.Axios({ method: ‘post‘, url: url, data: data, transformRequest:function (data) { let ret = ‘‘; for (let it in data) { ret += encodeURIComponent(it) + ‘=‘ + encodeURIComponent(data[it]) + ‘&‘ } return ret.slice(0, ret.length - 1); } }) .then(function (res) { if (res.data.error_code != -200) { return callback(new Error(‘名称重复‘)) } else { return callback() } }) .catch(function (err) { console.log(err); }) } else { callback(new Error(‘输入不符合规则‘)) } } };
言归正传，我们公司验证表单大部分是弹框内验证的。
当我打开弹框，form验证规则不满足，然后我关闭弹框，按理说应该取消红色提示，可是没有。
想到form有一个重置按钮，然后想到完全可以使用该方法。
可是打开之后之后，在控制台会报错，说该方法不存在！
上网查原因，一大堆都有，最后查到是element ui 打开弹框的方法是自带延迟的。
于是，我就用了下面的方法。
setTimeout(function () { that.$refs[‘dialogContent‘].resetFields(); },300)
还是有问题，如果网络慢怎么办，可能还是报错。
于是想到了js的try catch方法，我在外部给他包裹已一层try ,catch语句。问题解决！但是，测试最后提了个bug，那就是数据驱动的vue，页面内容没有改变。
内容被重复渲染。一直没有找到问题。最后才发现是setTimeout造成的！！！！！现在想想也傻，既然后try，catch了，为什么还要增加一个settimeout！！
try { setTimeout(function () { that.$refs[‘dialogContent‘].resetFields(); },300) } catch (e) { }
最终方法如下：
try { that.$refs[‘dialogContent‘].resetFields(); } catch (e) { }
问题解决
