vue局部指令

局部指令–只有注册得当前组件的实例才能用

定义在组件内，写法上最大的不同是定义时directives，而不是Vue.directive

【html】

  <div id="app">
    <div v-red>我是标题</div>
  </div>

  <div id="app2">
    <!-- 在此处不生效 -->
    <div v-red>我是标题</div>
  </div>

【js】

    // 局部指令，只有注册的当前组件实例才能用
    const app = new Vue({
      el: '#app',
      data: {

      },
      // 局部指令
      directives: {
        // 标准
        // red:{bind(el){},inserted,update,componentUpdated,unbind}
        // 简写
        red(el) {
          el.style.color = 'red'
        }
      }
    })

    const app2 = new Vue({
      el: '#app2',
      data: {

      }
    })