官方链接：http://doc.vue-js.com/v2/guide/custom-directive.html#simplest-directive-example

在main.js中注册自定义指令 v-input

注意：自定义指令要写在实例初始化之前

定义模板，在模板元素上使用新的 v-input 指令

想实现的效果：1.当页面加载时，该input元素将自动获得焦点；2.在输入框输入数字，当输入字数为6~10位时边框变为红色，其他情况下为蓝色；

自定义指令directive基础用法的更多相关文章

  1. angularjs - 自定义指令(directive)

    自定义指令(directive) 使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名. 例子:使用驼峰法来命名一个指令, demoDirect ...

  2. vue从入门到进阶：自定义指令directive，插件的封装以及混合mixins（七）

    一.自定义指令directive 除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令.注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件.然而,有的 ...

  3. angularjs自定义指令Directive

    今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...

  4. Vue input 控件: 通过自定义指令(directive)使用正则表达式限制input控件的输入

    前言: 网站中的input输入框使用非常广泛,因业务场景不同需要对输入框做合法性校验或限制输入,比如电话号码.邮件.区号.身份证号等.input框的不合法内容主要有两种方式处理:1.用户输入内容后,通 ...

  5. 自定义指令directive

    1.自定义指令 在angular中,module下面的directive方法用于创建自定义指令,用法: m1.directive('myTab',function(){ return { restri ...

  6. angularjs 一篇文章看懂自定义指令directive

     壹 ❀ 引 在angularjs开发中,指令的使用是无处无在的,我们习惯使用指令来拓展HTML:那么如何理解指令呢,你可以把它理解成在DOM元素上运行的函数,它可以帮助我们拓展DOM元素的功能.比如 ...

  7. angular 自定义指令 directive transclude 理解

    项目中断断续续的用了下angular,也没狠下心 认真的学习.angular 特别是自定义指令这块 空白. transclude 定义是否将当前元素的内容转移到模板中.看解释有点抽象. 看解释有点抽象 ...

  8. Angular自定义指令directive:scope属性

    在AngularJS中,除了内置指令如ng-click等,我们还可以自定义指令.自定义指令,是为了扩展DOM元素的功能.代码中,通过指定directive中的restrict属性,来决定这个指令是作为 ...

  9. angularJs自定义指令.directive==类似自定义标签

    创建自定义的指令 除了 AngularJS 内置的指令外,我们还可以创建自定义指令. 你可以使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名 ...

随机推荐

  1. IQKeyboardManager 问题锦集

    Keep UINavigationBar at the top (Don't scroll with keyboard) (#21, #24) If you don't want to hide th ...

  2. 3、Xamarin Forms 调整安卓TabbedPage 下置

    降低学习成本是每个.NET传教士义务与责任. 建立生态,保护生态,见者有份.   教程晦涩难懂是我的错误. 对于默认的TabbedPage 上面进行页面切换 上面是安卓默认的情况 对我们大部分人来说都 ...

  3. Ubuntu之tar与curl操作

    1,压缩备份: tar cfvj /tmp/test.tar.bz2  /tmp/test tar cfvz /tmp/test.tar.gz  /tmp/test tar xfvj /tmp/tes ...

  4. Qt: QTimer和QThread

    让QTimer 跑在其他线程. 一般写法如下. 1. 在main thread中为worker thread指定定时器. QThread* thread = new QThread(this); th ...

  5. 【java排序】 选择排序，插入排序，希尔算法

    一.选择排序 1.基本思想:在要排序的一组数中,选出最小的一个数与第一个位置的数交换:然后在剩下的数当中再找最小的与第二个位置的数交换,如此循环到倒数第二个数和最后一个数比较为止. 2.实例 3.算法 ...

  6. 最全面的 Android 编码规范指南

    最全面的 Android 编码规范指南 本文word文档下载地址:http://pan.baidu.com/s/1bXT75O 1. 前言 这份文档参考了 Google Java 编程风格规范和 Go ...

  7. SQL Function 自定义函数

    目录 产生背景(已经有了存储过程,为什么还要使用自定义函数) 发展历史 构成 使用方法 适用范围 注意事项 疑问   内容 产生背景(已经有了存储过程,为什么还要使用自定义函数) 与存储过程的区别(存 ...

  8. mybatis异常：Error instantiating class com.psc.bean.User with invalid types () or values ().

    Error instantiating class com.psc.bean.User with invalid types () or values (). 是由于bean类没有无参构建方法,添加一 ...

  9. android学习-异步消息处理机制

    消息处理机制主要对象:Looper,Handler,Message(还有MessageQueue和Runnable) Looper不断从MessageQueue消息队列中取出一个Message,然后传 ...

  10. Linux网络子系统

    再Linux的世界里,万物皆文件,通过虚拟文件系统VFS,程序可以用标准的Linux系统调用对不同的文件系统,甚至不同介质上的文件系统进行读写操作.下面我们揭示Linux网络子系统的秘密 sockfs ...