目录

• 用法
  • directives 文件
  • main.ts 文件
  • 组件使用
• 更多例子
• directive源码

用法

directives 文件

export const focus = {
  // 指令的定义
  mounted (el: any) {
    el.focus()
  }
}

main.ts 文件

import { createApp } from 'vue'
import router from '@/router'
import store, { key } from './store'
import App from './App.vue'
import antd from '@/plugins/antd'
import '@/styles/index.less'
import { focus } from './directive'

const app = createApp(App)
app.directive('focus', focus)

app.use(router)
app.use(store, key)
app.use(antd)

app.mount('#app')

组件使用

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

更多例子

https://learnvue.co/2020/01/creating-your-first-vuejs-custom-directive/

directive源码