除了默认设置的核心指令( v-model 和 v-show ), Vue 也允许注册自定义指令。
下面我们注册一个全局指令 v-val, 该指令的功能是在点击元素的时候做一些事情
1 <template> 2 <div class="home"> 3 <div v-val id="val">哈哈</div> 4 </div> 5 </template> 6 7 <script> 8 export default { 9 data() { 10 return {}; 11 }, 12 directives: { 13 val: { 14 bind: function (el, binding) { 15 console.log(el, binding); 16 var obox = el; 17 el.style.backgroundColor = "blue"; 18 // 设置指令的背景颜色 19 obox.onclick = () => { 20 alert("p"); 21 }; 22 }, 23 }, 24 }, 25 methods: {}, 26 }; 27 </script>