vue learning record (b) --- custom instruction component

A custom command

　　1, the overall custom instruction

< Body > 
< div ID = "Container" > 
    < div V-Bill = "prop" > {{MSG}} </ div > 
</ div > 
< Script the src = "./ vue.js" > </ Script > 
< Script > 
    // for each parameter are hooks (el, binding, vnode and oldVnode), name of the bill when it is required for use with the use of v-bill, if the hump nomenclature, then use - connected 
    Vue .directive ( ' Bill ' , {
        the bind () {                                  // global call when the binding element, called only once, if not adjusted, it would have been saved 
            console.log ( ' the bind ' , arguments The);
        },
        inserted The () {                             // when the binding element is inserted into the parent node calls 
            the console.log ( ' inserted The ' , arguments);
        },
        Update () {                               // vnode call where component updates 
            the console.log ( ' Update ' , arguments);
        },
        componentUpdated () {                     // called when the assembly is located VNode updating 
            the console.log ( ' componentUpdate ' , arguments);
        },
        the unbind () {                               // when unbound call instance will be invoked when vue destroyed 
            the console.log ( ' the unbind ' , arguments);
        }
    });
    let app = new Vue({
        el: '#container',
        data: {
            msg: 'this is test',
            prop: 'red'
        }
    })
</script>