vue---custom command

local custom directive

  <div id='app'>
    原数据: <span v-text="num"></span>
    放大十倍的数据<span v-big="num"></span>
  </div>

  <script>
    const app = new Vue({
    
    
      el: '#app',
      data: {
    
    
        num: 1
      },
      directives: {
    
    
        big: {
    
    
          bind(el, binding) {
    
    
            console.log(el, binding)
            el.innerText = binding.value * 10
          },
          inserted(el, binding, vnode) {
    
    
            el.innerText = binding.value * 10
          },
          update(el, binding, vnode, oldVnode) {
    
    
            el.innerText = binding.value * 10
          },
        }
      }
    })
  </script>

global custom directive

    Vue.directive('big', {
    
    
      bind(el, binding, vnode) {
    
     el.innerText = binding.value * 10 },
      inserted(el, binding, vnode) {
    
     el.innerText = binding.value * 10 },
      update(el, binding, vnode, oldVnode) {
    
     el.innerText = binding.value * 10 }
    });