Cómo añadir un botón personalizado con un comando personalizado en el panel predeterminado de grapesjs

Question

He integrado grapesjs con angular6. Y me aparece un panel por defecto con una caja de selección en la parte superior de la pantalla; Quiero un botón personalizado con mi propio comando personalizado en el panel predeterminado. Quiero añadir un botón que parece el que aparece abajo, marcado con color rojo. ! 6666666 Quiero que cuando haga clic en el botón, debería aparecer una caja de alerta en pantalla con un mensaje de Hello World. Por favor, dime cómo puedo añadir mi botón personalizado en el...

mcsekar12 · Accepted Answer

Usa 'editor'. Panels.getPanels()' para obtener todos los paneles disponibles y luego usar el método addButtons que se muestra a continuación. Aquí 'options' es el nombre del panel 'editor. Panels.addButton('options', [ { id: 'guardar', claseNombre: 'fa fa-floppy-o icon-blank', comando: function(editor1, sender) { alerta ('Hola Mundo') }, atributos: { título: 'Guardar plantilla' } }, ]);`

TemaMix · Answer

También tuve problemas con eso cuando intenté abrir el botón del panel. Así que usé la siguiente manera: editor. Panels.addButton('#target panel id#', { Id: 'botón de alerta', NombreClase: 'botón de alerta btn', etiqueta: 'Haz clic en mi trasero', command(editor) { alert('Hello World'); } Activo: Verdadero }); Sin embargo, el panel y el botón se mostraban. Se activa y necesita usar el método 'render' para volver a renderizar el objeto del gestor de paneles. No encuentro información sobre ello e...

mararn1618 · Answer

Esto está bien documentado en https://grapesjs.com/docs/getting-started.html#panels-buttons. Tienes dos métodos para añadir un panel con botones: (1) Al inicializar GrapesJS, (2) Después de inicializar GrapesJS con addPanel. Ten en cuenta que esto es para un panel que has definido con '

'.UvasJS.init() Después de que GrapesJS se inicializara

Cómo añadir un botón personalizado con un comando personalizado en el panel predeterminado de grapesjs

Pregunta

Respuestas (3)

Preguntas y respuestas relacionadas

Añadir el botón de Configuración a un componente personalizado.

Iconos personalizados

Cómo añadir un botón dentro del modal por defecto y capturar su evento de clic

Cómo cambiar el desplegable extra para el rasgo de cambio de enlace

Plugins de pago que cumplen con este problema

Explorar categorías de plugins