<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title> </head>
<body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vuex@3.0.1/dist/vuex.js"></script>
<div id="app">
<div>
<input v-model="dir1" v-my-directive1="dir1"/> </div>
</div> <script> const app = new Vue({
el: '#app',
data:{
dir1:'111',
dir2:'222'
},
directives:{
myDirective1:function(val){
console.log("===="+val)
}
} }) </script> </body>
</html>

vue directive demo的更多相关文章

  1. Vue directive自定义指令+canvas实现H5图片压缩上传-Base64格式

    前言 最近优化项目-手机拍照图片太大,回显速度比较慢,使用了vue的自定义指令实现H5压缩上传base64格式的图片 canvas自定义指令 Vue.directive("canvas&qu ...

  2. Vue.directive()的用法和实例

    官网实例: https://cn.vuejs.org/v2/api/#Vue-directive https://cn.vuejs.org/v2/guide/custom-directive.html ...

  3. 一个基于ES6+webpack的vue小demo

    上一篇文章<一个基于ES5的vue小demo>我们讲了如何用ES5,vue-router做一个小demo,接下来我们来把它变成基于ES6+webpack的demo. 一.环境搭建及代码转换 ...

  4. 一个基于ES5的vue小demo

    由于现在很多vue项目都是基于ES6开发的,而我学vue的时候大多是看vue官网的API,是基于ES5的,所以对于刚接触项目的我来说要转变为项目的模块化写法确实有些挑战.因此,我打算先做一个基于ES5 ...

  5. Vue directive 回调运用

    Vue的官方自定义directive,基本调用简洁如下: Vue.directive('my-directive', { bind: function () {},// 指令与被绑定元素第一次绑定时触 ...

  6. Vue.directive 自定义指令的问题

    1.今天复习一下Vue自定义指令的代码,结果出现一个很无语的结果,先贴代码. 2. <div id="example" v-change-by="myColor&q ...

  7. Vue.directive添加全局指令详解

    自定义指令创建: Vue.directive( 'mycolor(指令名称:推荐全部小写,驼峰命名会出现问题,看最后面)' , { bind:function(){}, //本例只介绍inserted ...

  8. Vue.directive注册指令

    指令定义函数提供了几个钩子函数(可选): vue指令的生命周期 bind: 只调用一次,指令第一次绑定到元素时调用,用这个钩子函数可以定义一个在绑定时执行一次的初始化动作. inserted: 被绑定 ...

  9. Vue.directive自定义指令

    Vue除了内部指令,我们也可以定义一些属于自己的指令,比如我们要定义一个v-diy的指令,作用就是让文字变成红色. 写好了这个功能,我们现在就自己定义一个全局的指令.我们这里使用Vue.directi ...

随机推荐

  1. openstack是什么?能干什么?

    openstack是什么?能干什么?涉及的初衷是什么?由什么来组成?刚接触openstack,说openstack不是一个软件,而是由多个组件进行组合,这是一个更深层次的理解,当我们看到dashboa ...

  2. 【前端学习笔记】2015-09-02 附~~~~~ajax简单请求和获得响应结果

    首先得创建一个请求XMLHttpRequest对象,var  xmlhttp=window.XMLHttpRequest?new XMLHttpRequest() : new ActiveXObjec ...

  3. ROS学习网址【原创】

    ROS学习网址 http://www.ros.org/ http://www.ros.org/news/book/ http://wiki.ros.org/ http://blog.exbot.net ...

  4. yii加载自带验证码的方法

    Yii的源码包里面是自带有验证码的相关类的,因此在使用验证码的时候无需再加载外部验证码类来助阵了.下面本文将介绍一下如何在项目中加载Yii自带的验证码功能. 具体分三步: (1)在需要加载验证码的co ...

  5. hdu 1796(容斥原理+状态压缩)

    How many integers can you find Time Limit: 12000/5000 MS (Java/Others)    Memory Limit: 65536/32768 ...

  6. SPOJ 1825 Free tour II (树的点分治)

    题目链接 Free tour II 题意:有$N$个顶点的树,节点间有权值, 节点分为黑点和白点. 找一条最长路径使得 路径上黑点数量不超过K个 这是树的点分治比较基本的题,涉及树上启发式合并……仰望 ...

  7. Xamarin.Forms的滚动视图ScrollView

    Xamarin.Forms的滚动视图ScrollView   在Xamarin.Forms中,滚动视图ScrollView用来实现长内容的滚动显示.虽然ScrollView的Content属性只能设置 ...

  8. Nginx日志参数、location匹配规则、设置密码

    1.三个参数 a)$http_referer:记录此次请求是从哪个链接访问过来的: 是直接访问,还是从其他网站跳转过来的. 例如:访问:http://www.etiantian.com/,其页面首页是 ...

  9. Ubuntu 16.04下使用Wine安装Windows版的微信(不太完美)

    说明: 真的不太完美,别试了:除了需要安装额外的输入法之后,无法上传图片和间接性的BUG出现等等问题. 建议安装网页版的微信:http://www.cnblogs.com/EasonJim/p/711 ...

  10. SQLServer 跟踪 扩展事件(Extended Events) 专家

    http://blog.csdn.net/kk185800961/article/details/49725903