Skip to main content

api.on()

Description​

Allows attaching a handler to the inner events

Usage​

api.on(
  event: string,
  handler: function
): void;

Parameters​

  • event - (required) an event to be fired
  • handler - (required) a handler to be attached (the handler arguments will depend on the event to be fired)
info

The full list of the Grid actions can be found here

Example​

In the example below we output to the console that the scroll action is detected.

import { Grid } from "wx-react-grid";
import { useEffect, useRef } from "react";
import { data, columns } from "./common/data";

export default function App() {
    const api = useRef(null);

    function doScroll(row, column) {
        if (api.current) {
            api.current.exec("scroll", { row, column });
        }
    }

    useEffect(() => {
        if (api.current) {
            api.current.on("scroll", () => {
                console.log(`Scrolling detected`);
            });
        }
    }, [api]);

    return (
        <>
            <button  onClick={() => doScroll(data[0].id, columns[1].id)}>
                Scroll to First Row / Column
            </button>
            <Grid api={api} data={data} columns={columns} />
        </>
    );
}

Related articles: