directives:vue的自定义指令

除了默认设置的核心指令( 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>
原文地址:https://www.cnblogs.com/shun1015/p/13714845.html