vue2、vue3自定义指令（私有指令，全局指令）

vue2自定义指令需把vue3自定义指令的mounted换成bind，updated换成update

 以下是vue3自定义指令

私有指令

<template>
<input type="text" v-focus>
</template>
<script>
export default {
  name: 'Ge',
  //私有自定义组件
  directives:{
    focus:{
    //第一次插入dom触发
      mounted(el) {
        el.focus()
      },
    //每次dom更新都触发
       updated(el) {
        el.focus()
      },
    }
  },

全局指令

main.js

// 导入createApp函数
import { createApp } from "vue";
// 导入待渲染的app.vue组件
// import App from './App.vue'
import App from './components/brother/App.vue'
const app = createApp(App)
//全局指令
app.directive('focus',{
    //第一次插入dom触发
      mounted(el) {
        el.focus()
      },
    //每次dom更新都触发
       updated(el) {
        el.focus()
      },
})
app.mount('#app')

 使用

<template>
<input type="text" v-focus>
</template>