这是一个创建于 2366 天前的主题，其中的信息可能已经有所发展或是发生改变。
在做一个 Vue+elementUI 的 toB 项目，一个页面也 170 个字段。。。
一个大 form 单页面是不可能的，字段命名有很多差不多的不好处理，验证规则也是五花八门，还包括三种地图和各种奇奇怪怪的上传列表，之前提出过用分步骤创建的办法被甲方拒绝了
现在用自定义组件将不同组的字段结合在一起，每个组件是一个 form，组件里面单独写验证规则，主页面有一个创建按钮做数据汇总
最开始想的用 event bus 的方法在每个组件设置事件接收，再把验证结果存到 vuex 里面，但实现之后才发现异步验证很难做，有些字段需要根据其他字段的内容做二次验证，然后再到 server 异步验证，需要每个字段都放入 vuex，最后成了一个超长的 store.js ，看着不爽
所以想到在组件结合处调用 element 自带的 validate 方法，每个 validate 返回一个 promise 统一 catch，这个方法做起来很简单，最后使用效果也不错，就是在提交处有太多 then().then().then()
大神们有什么好方案吗
 |
1
wenzhoou 2018-07-01 23:40:25 +08:00 via Android
用户一次输入 170 个字段，然后一个字段验证出错了都不能提交。哦。这是一种什么样的体验啊。
甲方不同意改设计。那好吧。摊手。 你怎么不让我在针尖上盖大楼呢。 |
 |
3
zhangzhang 2018-07-02 07:56:29 +08:00
试一下把一个超大表单分成几个步骤完成，这样每个步骤需要填写的东西就少了很多
|
 |
4
murmur 2018-07-02 07:58:57 +08:00
这种东西在 jquery 年代就早解决了
jQuery validation 啊 这个插件也支持异步验证的 另外这种东西最好还是优化下需求 pc 上渲染着不卡填起来也烦 而且暂存一定要做好 |
Select Language