Skip to main content

undo

Description​

Allows performing steps back in history

It's required to enable the undo property to perform 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.

<script setup>
  import { Button } from "@svar-ui/vue-core"; // import the Button component
  import { Grid } from "@svar-ui/vue-grid";
  import { getData } from "../data";
  import { ref } from "vue";

  const { data, columns } = getData();

  const api = ref();

  function undo() {
    api.value.exec("undo");
  }

</script>

<template>
  <Button :onclick="undo">Undo</Button>
 
  <div style="height: 400px; margin-top: 10px;">
    <Grid
        ref="api"
        :data="data"
        :columns="columns"
        :undo="true"
    />
  </div>
</template>

Related articles: