Vue.directive()注册自定义指令

定义的指令不支持驼峰式写法，所以指令命名统一变为小写,或者用用'-'或'_'分割

要使用自定义的指令，需在对用的元素中，加上'v-'的前缀形成类似于内部指令'v-if'，'v-text'的形式

<div id="app">
    <div v-yeluosen="changeColor">{{num}}</div>
    <button @click="add">增加</button>
</div>

        <script type="text/javascript">
            Vue.directive('yeluosen', function(el, bind, vNode){
                el.style.color = bind.value();
            });
            var app = new Vue({
                el: '#app',
                data: {
                    num: 10,
                    color: 'red'
                },
                methods: {
                    add: function(){
                        this.num++;
                    },
                    changeColor: function(){
                        return this.color;
                    }
                }
            });