¿Cómo ejecutar comandos para un componente de bloque?
Para lograrlo, puedes escuchar el evento drag del editor:
Lee la respuesta completa abajo ↓Pregunta
editor. BlockManager.add('test', {
etiqueta: 'prueba',
categoría: 'Básico',
comando: () => {
editor.runCommand('open-assets')
}
});
Me gustaría hacer algo así. Así que, una vez que un usuario deja caer el componente de prueba en el lienzo, me gustaría abrir el modal de gestor de activos donde puedas subir una imagen ejecutando el comando 'open-assets'.
Muchas gracias, Artur
Respuestas (3)
Para lograrlo, puedes escuchar el evento drag del editor:
editor.on('block:drag:stop', component => {
Identifica tu componente y haz algo interesante :)
});
@NicoEngler ¡Gracias por responder! aunque no estoy seguro de cómo insertar una imagen desde el modal de imagen en el componente link-block
editor.on('block:drag:stop', model => {
if (model.getName() === 'Enlace') {
editor.runCommand('open-assets', {
objetivo: this.editor.getSelected()
});
}
});
Si hago esto, no pasa nada incluso después de seleccionar una imagen del modal @artf ¿Hay alguna forma de hacerlo?
Además, el modal está vacío al principio antes de abrir el administrador de activos usando el componente Imagen. No sé por qué...
Me temo que no puedo ayudar más sin tener que trastear yo mismo con el código. Aunque puedo ayudar depurando si disparas un ejemplo en Codepen o similar.
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #1034
Insertar elemento o bloque dentro del elemento padre
Buenos días, tengo componente, tengo bloqueo tengo Trait en los cambios de escucha, ¿cómo puedo añadir "h1" dentro de ese bloque "''<div cl...
Issue #1584
No obtengo el script de bloque de editor.getComponents()
A continuación está el componente que voy a añadir.this.editor.BlockManager.add('dob-mmyy-pii', { id: 'dob-mmyy', etiqueta: 'FECHA DE NACIM...
Issue #1484
[Pregunta]: Las filas siguientes del bloque de texto no dan el cursor/editor de texto enriquecido al hacer clic, sino que se seleccionan en su lugar
He notado un comportamiento extraño en mi adaptación de GrapesJS respecto al editor de texto rico y el plugin gjs-blocks-basic. Cada vez qu...
Issue #1471
[Pregunta] Gestor de bloques e imagen
¡Hola! Uso este código para añadir un nuevo bloque: blockManager.add("image", { etiqueta: 'Image', categoría: 'Básico', atributos: { clase:...
Plugins de pago que cumplen con este problema
Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.
Cargando recomendaciones de plugins de pago...
Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.
Explora plugins gratuitos →Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.
Explora plugins premium →Tutoriales relacionados
Guías detalladas sobre el mismo tema.
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.