一个不错的vue表单验证插件
github文档 用着不错,官方的文档例子很简单
<body>
<div id="app">
<validator name="validation1">
<form novalidate>
<div class="username-field">
<label for="username">username:</label>
<input id="username" type="text" v-validate:username="['required']">
</div>
<div class="comment-field">
<label for="comment">comment:</label>
<input id="comment" type="text" v-validate:comment="{ minlength: 2 }">
</div>
<div class="errors">
<p v-if="$validation1.username.required">Required your name.</p>
<p v-if="$validation1.comment.minlength">Your comment is too long.</p>
</div>
<input type="submit" value="send" v-if="$validation1.valid">
</form>
</validator>
<script>
var vm = new Vue({
el: '#app'
})
</script>
</body>
直接用就可以了,自己把CSS改一下,就能用在现在的项目上了。
一个不错的vue表单验证插件的更多相关文章
- 写一个简单易用可扩展vue表单验证插件(vue-validate-easy)
写一个vue表单验证插件(vue-validate-easy) 需求 目标:简单易用可扩展 如何简单 开发者要做的 写了一个表单,指定一个name,指定其验证规则. 调用提交表单方法,可以获取验证成功 ...
- 【jquery】Validform,一款不错的 jquery 表单验证插件
关于 Validform 这是一款很不错的 jquery 表单验证插件,它几乎能够满足任何验证需求,仅仅一行代码就能搞定整站的表单验证. $('form').Validform(); 为什么能如此方便 ...
- Vue表单验证插件的制作过程
一.表单验证模块的构成 任何表单验证模块都是由 配置――校验――报错――取值 这几部分构成的. 配置: 配置规则 和配置报错,以及优先级 校验: 有在 change 事件校验, 在点击提交按钮的时候校 ...
- Vue 表单验证插件
verify github:https://github.com/liuyinglong/verifynpm:https://www.npmjs.com/package/vue-verify-plug ...
- VeeValidate——vue2.0表单验证插件
一.vee-validate入门 vee-validate 是一个轻量级的 vue表单验证插件.它有很多开箱即用的验证规则,也支持自定义验证规则.它是基于模板的,因此它与HTML5验证API类似且熟悉 ...
- 10个强大的Javascript表单验证插件推荐
创建一个JavaScript表单验证插件,可以说是一个繁琐的过程,涉及到初期设计.开发与测试等等环节.实际上一个优秀的程序员不仅是技术高手,也应该是善假于外物的.本文介绍了10个不错的JavaScri ...
- jQuery Validate 表单验证插件----自定义一个验证方法
一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW 访问密码 f224 二.引入依赖包 <script src="../../scripts/j ...
- jQuery学习之:Validation表单验证插件
http://polaris.blog.51cto.com/1146394/258781/ 最近由于公司决定使用AJAX + Struts2来重构项目,让我仔细研究一下这两个,然后集中给同事讲讲,让每 ...
- nice-validator表单验证插件的简单使用
前言 前端表单校验是过滤无效数据.假数据.有毒数据的第一步,是数据安全的第一道关卡,虽然我们不能100%相信客户端提交的数据(真正的校验还得在服务端进行),但设置前端表单校验也是至关重要的,自己写逻辑 ...
随机推荐
- 深入理解Javascript--闭包
原网站http://www.cnblogs.com/xiaoloulan/p/5980569.html 在了解闭包之前需要了解下作用域的工作原理作为基础,传送门. 闭包是一个老生常谈的问题,在面试中也 ...
- Puppet自动化运维-资源介绍篇(4)
1.什么是资源? 资源是Puppet最基础的元素,每个资源的定义都具有标题,类型,以及一系列的属性. 资源定义有如下的特性: (1) Puppet使用title在编译时区分每个资源,使用命名变量在 ...
- 【iOS atomic、nonatomic、assign、copy、retain、weak、strong】的定义和区别详解
一.atomic与nonatomic 1.相同点 都是为对象添加get和set方法 2.不同点 atomic为get方法加了一把安全锁(及原子锁),使得方法get线程安全,执行效率慢 nonatomi ...
- vuejs的使用方法
1.安装webpack打包工具 npm install -g webpack 2.安装vue客户端 npm install -g vue-cli 3.初始化项目 vue init webpack de ...
- AutoCAD .net 开发 SelectionFilter Foreach Linq 性能比较
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- [软件推荐]快速文件复制工具(Limit Copy) V4.0 绿色版
快速文件复制工具(Limit Copy)绿色版是一款智能变频超快复制绿色软件. 快速文件复制工具(Limit Copy)功能比较完善,除了文件复制还可以智能变频,直接把要复制的文件拖入窗口即可,无需手 ...
- 【翻译svg教程 】svg 的坐标系统
http://tutorials.jenkov.com/svg/svg-coordinate-system.html svg的坐标系统(和大多数计算机绘图的坐标系统)和数学中绘图系统有点不一样 数学/ ...
- 【BZOJ】4245: [ONTAK2015]OR-XOR
题意 给定一个长度为\(n(1 \le n \le 500000)\)的序列\(a_i(0 \le a_i \le 10^{18})\),将它划分为\(m(1 \le m \le n)\)段连续的区间 ...
- Windows中断那些事儿
搞内核研究的经常对中断这个概念肯定不陌生,经常我们会接触很多与中断相关的术语,按照软件和硬件进行分类: 硬件CPU相关: IRQ.IDT.cli&sti 软件操作系统相关: APC.DPC.I ...
- Yii框架CURD方法
在YII框架中,CURD有2种方式: 1.AR模式:2. DAO模式 AR模式下 查全部 MODEL $model->find()->asArray()->all()查单 个 ...