createDisposableDirective

类别

Utilities

导出大小

用于编写一次性指令的工具。在 mounted 指令钩子中创建的响应式效果将被跟踪，并在指令卸载时自动清理。

🌐 Utility for authoring disposable directives. Reactive effects created within mounted directive hook will be tracked and automatically disposed when directive is unmounted.

用法

🌐 Usage

创建一个使用 createDisposableDirective 的指令

🌐 Creating a directive that uses createDisposableDirective

import { useMouse } from '@vueuse/core'
import { createDisposableDirective } from '@vueuse/shared'

export const VDirective = createDisposableDirective({
  mounted(el, binding) {
    const value = binding.value
    if (typeof value === 'function') {
      // [`useMouse`](/core/useMouse/) event listener will be removed automatically when directive is unmounted
      const { x, y } = useMouse()
      watch(x, val => value(val))
    }
  }
})