vue之自定义指令
像v-if、v-show、等这些都是系统指令，比如说我想写一个v-color的指令，但是系统是没有这个指令的，如果我们直接这样写肯定会报错，所以我们下面就需要自定义指令。
1 <div id="app"> 2 ?3 ????<h1 v-color="pink">11111111111111</h1> 4 ?5 </div> 6 ?7 <script src="vue.js"></script> 8 <script> 9 10 ????Vue.directive("color",function(el,binding){11 ????????/*console.log(el);12 ????????console.log(binding); */13 14 ????????el.style[binding.name] = binding.expression;15 16 ????});17 ????new Vue({18 ????????el:"#app",19 ????????data:{20 ????????????pink:""21 ????????}22 23 ????})24 </script>25 </body>上面这种Vue.directive是全局的写法，里面有两个参数第一个是指令名称，第二个是一个方法，方法里面也有两个参数第一个参数el就是Dom节点，第二个是这个对象里面有个name属性，name对应color就是这个color。
这是一个全局的写法。
???下面这种是局部的写法（注意的是directive要加s）：
1 <div id="app"> 2 ?3 ????<h1 v-color>11111111111111</h1> 4 ????<h2 v-date>456</h2> 5 ?6 </div> 7 ?8 <script src="vue.js"></script> 9 <script>10 ????new Vue({11 ????????el:"#app",12 ????????directives:{13 ????????????"color":function(el,binding){14 ????????????????el.style.color = "red"15 ????????????},16 ????????????"date":function(el,binding){17 18 ????????????????el.innerHTML = "123"19 ????????????}20 ????????}21 ????})初识vue.js，我的学习之路（三）
原文地址：http://www.cnblogs.com/hsgg/p/8092651.html