vue指令Vue.directive

1.在自定义页面里使用
bind,inserted
bind:指令第一次绑定到元素时调用,在绑定时执行的初始化动作
inserted: 被绑定元素插入父节点时调用

<template>
  <div id="app">
    <button @click="age++">change</button>
    <button @click="unbind">解绑</button>
    <input type="text" v-focus/>
    <p>{
  {age}}</p>
  </div>
</template>
<script>
export default {
  data() {
    return {
      age:15,
    };
  },
  directives: {
    focus: {
      //自定义指令名字
      bind() {
        console.log("绑定了元素");
      },
      inserted(el, binding) {
        // 当页面刷新时，自动聚焦到input框上
        el.focus();
        console.log("已经插入文档");
      },
      update() {
        console.log("数据将更新");
      },
      componentUpdated() {
        console.log("数据更新");
      },
      unbind() {
        console.log("解绑");
      },
    },
  },
  methods:{
    unbind()