Skip to main content

undo

Description​

Allows performing steps back in history

It's required to enable the undo property to perfrom the action. The action cannot be executed in the tree mode.

Actions that can be undone: add-row, update-row, update-cell, delete-row, move-item, collapse-column, resize-column, hide-column.

Usage​

"undo": () => void;

Parameters​

The callback of the action takes no parameters.

Example​

We enable the undo action on a button click.

import { useRef } from "react";
import { Button } from "@svar-ui/react-core"; // import the Button component
import { Grid } from "@svar-ui/react-grid";
import { getData } from "../data";

const { data, columns } = getData();

const apiRef = useRef(null);

function undo() {
  apiRef.current?.exec("undo");
}

export default function Example() {
  return (
    <>
      <Button onClick={undo}>Undo</Button>

      <div style={{ height: 400, marginTop: 10 }}>
        <Grid
          ref={apiRef}
          data={data}
          columns={columns}
          undo={true}
        />
      </div>
    </>
  );
}

Related articles: