2019-12-13 elementUI d出层表单验证组件的坑

这个退样登记 和下面的编辑 是一个功能，都是d出层

上面的按钮 是d出一个空白的表单，下面的编辑则是带出原有数据显示的表单，

那么这里就有个坑。

1，打开d出层，直接给表单赋值，那么点击取消的时候，表单自动把你赋值了的数据，当作是了初始默认值，也就是调用

this$refs['form']resetFields()  这个方法之后，，回到了你赋值完之后哪一瞬间。上面的按钮每次要清空数据和验证，下面的按钮每次要带入数据，脱出的时候也要验证

解决办法， 异步赋值，使用setTimeout() 或者 $nextTick() 等DOM 生成后再赋值，那么清除函数就以初始 空表单给赋值。

这里注意了 ，再清空的时候 也必须要使用异步 来清空  

坑之 二：

这里点击留存实验室

可以用v-if和V-SHOW各自存在一个坑，

第一：v-if  使用，必须要把el-from-item 外面包一层 DIV,不然，当点击提交，验证出来之后，你再切换另一个更多表单的，就回把验证提示的位置 飘逸错误的位置，

最近在使用elementui 中的form表单遇到的一个诡异的问题，我form表单外面嵌套着一个dialog,当我新建一个form对象是，使用官网提供的 this$refsformresetFields()我有效果的，但是当我给form手动赋值后，再重新点开form，内容并没有清空

输入内容清空正常：

手动赋值，重新再打开form,不能清空内容

后面经过在网上查帖子，可算解决了这个问题。

当我们遇到这样的问题时，可以尝试按以下方式进行排查错误：

数字类型的验证需要在 v-model 处加上 number 的修饰符，这是 Vue 自身提供的用于将绑定值转化为 number 类型的修饰符，

注意：此方法不能输入小数

需求：点击当前页面的按钮跳转到首页，给menu中绑定的default-active赋值

问题：页面已经跳转过去，可menu选中项根本没有发生变化

解决办法： 直接将当前页面的路由绑定到default-active上，同时将index改为当前路由，这样在通过非点击导航菜单跳转页面时就不需要再来手动改变导航菜单的选中项了，它会自己选中当前页面的tab项，完美解决！

说明：router属性很重要，default-active="this$routepath"也很重要。

在public文件夹里面，新建mock文件夹，在里面建一个menujson文件模拟后台数据

最近碰到一个问题，就是在 vuejs 项目中搭配 elementui 组件库中的 el-form 动态表单问题，踩了一点坑，在此记录

重点在第二层循环 prop 绑定的问题, 'propertyGroup' + index + 'groupProperty' + j + 'value' ,是第一层和第二层的数组和 index 都要加上，要不然验证加不上。

工具地址： >

以上就是关于2019-12-13 elementUI d出层表单验证组件的坑全部的内容，包括:2019-12-13 elementUI d出层表单验证组件的坑、elementui form 表单数据不置空问题、elementui的表单验证等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！