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() handler, and then we use the api.detach() method to stop logging the open-task action.

import { useState, useEffect, useRef } from "react";
import { getData } from "./common/data";
import { Gantt } from "wx-react-gantt";
import "wx-react-gantt/dist/gantt.css";

const MyComponent = () => {
  const [data, setData] = useState(getData());
  const apiRef = useRef();

  useEffect(() => {
    const api = apiRef.current;
    if (api) {
      api.on(
        "open-task",
        ({ id }) => {
          console.log("Opened: " + id);
        },
        { tag: "track" }
      );
    }
  }, [apiRef]);

  const stop = () => {
    const api = apiRef.current;
    api.detach("track");
  };

  return (
    <div>
      <button onClick={stop}>Stop logging</button>
      <Gantt apiRef={apiRef} tasks={data.tasks} links={data.links} />
    </div>
  );
};

export default MyComponent;

Related articles: How to access Gantt API