Skip to main content

api.detach()

Description​

Allows removing/detaching action handlers

Usage​

api.detach(tag: number | string ): void;

Parameters​

  • tag - the name of the action tag

Example​

In the example below we add an object with the tag property to the api.on() and api.intercept() handlers, and then we use the api.detach() method to stop logging the actions.

import { useRef } from "react";
import { getData, getDrive } from "./common/data";
import { Filemanager } from "@svar-ui/react-filemanager";

function App() {
  const apiRef = useRef(null);

  function init(api) {
    // Keep a reference to api so we can call detach later
    apiRef.current = api;

    api.on(
      "select-file",
      ({ id }) => {
        console.log("Selected: " + id);
      },
      { tag: "track" }
    );

    api.on(
      "set-path",
      ({ id }) => {
        console.log("Path: " + id);
      },
      { tag: "track" }
    );
  }

  function stop() {
    if (apiRef.current) {
      apiRef.current.detach("track");
    }
  }

  return (
    <>
      <button onClick={stop}> Stop logging </button>
      <Filemanager init={init} data={getData()} drive={getDrive()} />
    </>
  );
}

export default App;

Related articles: