vue3语法糖添加自定义指令

在Vue 3中，你可以使用`app.directive`函数来添加自定义指令。下面是一个示例：

const app = Vue.createApp({})

app.directive('customDirective', {
  mounted(el, binding) {
    // 在指令绑定到元素时调用
    // 可以在这里操作DOM或添加事件监听器等
  },
  updated(el, binding) {
    // 在指令所在组件的VNode更新时调用
    // 可以根据需要更新DOM或执行其他操作
  },
  unmounted(el, binding) {
    // 在指令从元素上解绑时调用
    // 可以在这里清除事件监听器等
  }
})

app.mount('#app')

在上面的示例中，我们使用`app.directive`函数添加了一个名为`customDirective`的自定义指令。该函数接受两个参数：指令名称和指令选项对象。在选项对象中，我们可以定义三个生命周期钩子函数：`mounted`、`updated`和`unmounted`。这些钩子函数分别在指令绑定到元素、指令所在组件的VNode更新以及指令从元素上解绑时被调用。

通过这种方式，你可以方便地添加自定义指令并在需要的时候执行相应的操作。希望对你有所帮助！如果还有其他问题，请继续提问。