一、自定义指令
1、全局自定义指令
<body> <div id="container"> <div v-bill="prop">{{msg}}</div> </div> <script src="./vue.js"></script> <script> //每个钩子的参数都是 ( el、binding、vnode 和 oldVnode),名称是bill但是使用的时候需要用v-bill进行使用，如果是驼峰命名法，那么就用-进行连接 Vue.directive('bill', { bind(){ //全局绑定元素时调用，只调用一次,如果没有调整的话，会一直保存 console.log('bind', arguments); }, inserted() { //被绑定元素插入父节点时调用 console.log('inserted', arguments); }, update() { //所在组件的 VNode 更新时调用 console.log('update', arguments); }, componentUpdated() { //所在组件的 VNode 更新时调用 console.log('componentUpdate', arguments); }, unbind() { //解绑时调用，vue实例销毁时也会被调用 console.log('unbind', arguments); } }); let app = new Vue({ el: '#container', data: { msg: 'this is test', prop: 'red' } }) </script>