vue 注册或获取全局指令directive

注册方法

Vue.directive(‘my-directive’, {
bind: function () {},
inserted: function () {},
update: function () {},
componentUpdated: function () {},
unbind: function () {}
})

<template>
  <div>
    <h1 v-loading="isloading">{{msg}}</h1>
    <button type="button" @click.prevent="update">更新</button>  
  </div>
</template>
```import Vue from 'vue';
Vue.directive("loading",{
  update(el,binding,vnode){
    if(binding.value){
      const div = document.createElement("div")
      div.innerText = "加载中。。。。"
      div.setAttribute("id","loading")
      div.style.position = "fixed";
      div.style.width = '100%';
      div.style.height = "100vh";
      div.style.left = "0";
      div.style.top = "0";
      div.style.background = "rgba(0,0,0,0.7)";
      div.style.color = "white";
      document.body.append(div)
    }else{
      document.body.removeChild(document.getElementById("loading"))
    }
  }
})
export default {
  name: 'HelloWorld',
  data () {
    return {
       msg: '',
      isloading:false
    }
  },
  methods:{
       update(){
      this.isloading = true;
      setTimeout(()=>{
        this.msg = "数据更新";
        this.isloading = false;
      },3000)
    }
  }
}

在这里插入代码片