Início / coding / Perguntas / 78356399
Accepted
Atlas
Asked: 2024-04-20 06:30:05 +0800 CST

Como criar botões personalizados de desfazer/refazer para o editor de modelos GrapesJS?

  • 772

Estou trabalhando em um projeto usando o editor de modelos GrapesJS e estou tentando implementar a funcionalidade de desfazer/refazer com dois botões. É claro que os botões que criei não possuem atualmente as ações de desfazer e refazer.

Por favor me ajude!

<div class="action">
    <a class="btn" id="undo-btn"><i class="fa fa-undo"></i></a>
    <a class="btn" id="redo-btn"><i class="fa fa-redo"></i></a>
</div>

const editor = grapesjs.init({
  // Indicate where to init the editor. You can also pass an HTMLElement
  container: '#gjs',
  // Get the content for the canvas directly from the element
  // As an alternative we could use: `components: '<h1>Hello World Component!</h1>'`,
  fromElement: true,
  // Size of the editor
  height: '300px',
  width: 'auto',
  // Disable the storage manager for the moment
  storageManager: false,
  // Avoid any default panel
  panels: { defaults: [...] },
  // ...
});

$('#undo-btn').click(function() {
    // undo action here
})
$('#redo-btn').click(function() {
    // redo action here
})
javascript

1 respostas

  1. Best Answer

    Você pode usar o seguinte código:

    $('#undo-btn').click(function() {
    editor.Commands.run('core:undo');
})
$('#redo-btn').click(function() {
    editor.Commands.run('core:redo');
})
    • 1

relate perguntas