Skip to content
ФреймворкJavaScript

History API: отмена, повтор и транзакции

Управление функциональностью отмены/повтора для операций редактора.

Редактировать на GitHub

Как получить экземпляр редактора

Методы ниже вызываются на редакторе, созданном через new Blok(). Они доступны после того, как разрешится editor.isReady.

TypeScript
// You already hold the instance returned by the constructor.
const editor = new Blok({ holder: 'editor' });
await editor.isReady;

// Call any API method on it.
editor.caret.setToLastBlock('end');

Методы

history.undo()

void

Undo the last operation.

Когда использовать

Программный Ctrl/Cmd+Z. Ничего не делает, когда отменять нечего — проверяйте canUndo() для своих кнопок.

TypeScript
// Undo last change
editor.history.undo();

// Undo multiple times
for (let i = 0; i < 3; i++) {
  editor.history.undo();
}

history.redo()

void

Redo the last undone operation.

Когда использовать

Программный Ctrl/Cmd+Shift+Z. Проверяйте canRedo() в своём UI, чтобы кнопка корректно отключалась.

TypeScript
// Redo last undone change
editor.history.redo();

// Redo multiple times
for (let i = 0; i < 3; i++) {
  editor.history.redo();
}

history.canUndo()

boolean

Check if undo is available (there are operations to undo).

Когда использовать

Используйте для включения/отключения своей кнопки отмены; в паре с undo().

TypeScript
if (editor.history.canUndo()) {
  editor.history.undo();
} else {
  console.log('Nothing to undo');
}

history.canRedo()

boolean

Check if redo is available (there are undone operations to redo).

Когда использовать

Используйте для включения/отключения своей кнопки повтора; в паре с redo().

TypeScript
if (editor.history.canRedo()) {
  editor.history.redo();
} else {
  console.log('Nothing to redo');
}

history.clear()

void

Clear all history. Removes all undo/redo entries.

Когда использовать

Сбрасывает весь стек отмены — вызывайте после загрузки нового контента, чтобы нельзя было отменить до предыдущего документа.

TypeScript
// Clear history when loading new content
editor.blocks.render(newData);
editor.history.clear();