Skip to main content

detach

Removes a handler or interceptor that was registered with api.on or api.intercept using a tag. Call this to clean up event subscriptions when they're no longer needed.

Usage

detach(tag: number | string | symbol): void;
ParameterTypeDescription
tagnumber | string | symbolThe tag assigned when registering the handler via the config parameter of on or intercept

Example

Register a handler with a tag, then remove it later:

<script setup>
import { Kanban } from "@svar-ui/vue-kanban";
import { ref } from "vue";

const api = ref(null);

function attach(a) {
api.value = a;
api.value.on("update-card", (ev) => {
console.log("card updated", ev.id);
}, { tag: "logger" });
}

function cleanup() {
api.value.detach("logger");
}
</script>

<template>
<Kanban :cards="cards" :columns="columns" :init="attach" />
<button :onclick="cleanup">Remove logger</button>
</template>
  • on - register a handler with a tag for later detaching
  • intercept - register an interceptor with a tag