21 自定義標籤

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="../../lib/vue.js"></script> <script src="../../lib/axios.js"></script> </head> <body> <div id="app"> <div v-hello=" 'red' ">454445</div> <div v-hello=" 'blue' ">1111111111</div> <div v-hello=" 'yellow' ">222222222222222</div> <div v-hello="mycolor">3333333333333</div> </div> <script> Vue.directive("hello",function(el,binding){ el.style.background=binding.value }) /* Vue.directive("hello",{ //指令的生命週期 //創建 inserted(el,binding){ // console.log("綁定當前指令的標籤插入父節點就會執行",binding) el.style.background=binding.value }, //更新 update(el,binding){ console.log("綁定當前指令的標籤插入父節點就會執行1",binding) el.style.background=binding.value }, }) */ new Vue({ el:"#app", data:{ mycolor: "red" } }); </script> </body> </html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章