zoukankan      html  css  js  c++  java
  • formvalidation的使用

    1、为什么要使用formvalidation

    最近买了一套vue的前端页面,登录页面使用了formvalidation作为输入的验证,样式挺好看的,会在验证通过时在输入框的右侧显示对勾,在验证不通过时在右侧显示叉号,并在底部显示验证不通过的消息,于是想在其他页面新增对象的模式窗口中也增加这种验证方式

     formvalidation的官方网址

     https://formvalidation.io/guide/getting-started/

    2、遇到的异常

    我把代码原封原样的拷到了用户管理页面中新增用户的模式窗口中,稍作修改,然后在页面中查看效果,总是报一个classList not found的异常,并且出不来效果

     

     

    3、分析异常的过程

    我不知道是不是我少拷了哪部分数据,只好把用户列表页面做了备份,然后把登录页面的全部代码拷到用户列表页面,覆盖用户列表页面的内容,这次效果出来了,然后我一点一点的把页面多余不用的东西删掉,最后只留下formvalidation的那部分需要用到的内容,发现我并没有少拷任何东西,formvalidation要使用起来也很简单,就一个导入需要的资源,然后就是定义需要校验的字段。

    那么问题出在哪里呢,难道是因为模式窗口一开始是隐藏的状态?我又恢复了用户列表页的原先代码,我把模式窗口一开始就设置为显示状态,发现这次竟然不报错了,formvalidation的效果也出来了。

    我决定把formvalidation的初始化工作放到点击新增按钮后来执行,修改代码后发现点击按钮模式窗口弹出后还是报错,formvalidation的效果依然出不来,这个情况我大致可以预料一下,可能是因为方法执行应该放在模式窗口初始化完成后再执行,但是模式窗口并没有提供初始化完成的事件。

    查阅资料后发现vue提供了这么一个方法来解决这个问题,那就是$nextTick方法

     最后提醒大家注意的一个问题,就是这热resetForm方法,js中定义的fields一定要与form中输入项能够一一对上,否则resetForm会报一个foreach的异常,好像是这个异常,不太记得了,总之会报错,无法执行。

  • 相关阅读:
    数字证书学习笔记
    在微服务中使用领域事件
    用Gradle构建Spring Boot项目
    七言 朱雀
    作为分享者
    Spring Framework学习要点摘抄
    Servlet 3.0/3.1 中的异步处理
    Java集合学习笔记
    Java垃圾回收学习笔记
    你究竟有多了解Spring?
  • 原文地址:https://www.cnblogs.com/LcxSummer/p/14631210.html
Copyright © 2011-2022 走看看