如何在 Vue3 中使用组合 API 定义自定义指令?

该文档非常清楚如何使用“旧方式”使用 app.directive() 创建自定义指令,但这并没有考虑到组合 API 的处理方式。

我期望的是这样的:

  1. import MyDirective from "@/directives/MyDirective.vue" 在组件内。
  2. 使用组件模板中的指令,例如 <div my-directive></div>

最好不必添加样板,例如在 main.ts 中注册指令或任何类似的东西。

但是,我找不到任何明确的示例或描述此的文档页面。这是可能吗?我该怎么做?请包括指令定义本身的示例。

stack overflow How do I define a custom directive using composition API in Vue3?
原文答案