Versión GrapesJS

• Confirmo que se debe usar la última versión de GrapesJS

¿Qué navegador usas?

Versión de Chrome 115.0.5790.114

Enlace de demo reproducible

https://jsfiddle.net/mcraf3se/5/

Describe el bicho

Hola, acabo de empezar con GrapesJS, así que es bastante probable que esté malinterpretando algo fundamental. Me cuesta configurar los gestores de eventos en la vista de un componente personalizado.

¿Cómo reproducir el bicho? En el JS enlazado.

1. Arrastrar bloque Mi Div sobre el lienzo
2. Haz clic dentro de él (debería haber una división con 'stuff').

¿Cuál es el comportamiento esperado? Según la documentación aquí, los gestores de eventos deberían estar vinculados al componente y debería poder usar algo como 'this.model. ...`.

¿Cuál es el comportamiento actual? Cuando se ejecuta localmente, el manejador está vinculado a una ventana. En el JSFilddle esto parece estar indefinido. En ambos casos falla llamar a this.model.components

Si es necesario ejecutar algo de código para reproducir el error, pégalo aquí abajo:

'''js

El violín debería tener el código, pero si alguien quiere ejecutarlo localmente. Aquí está el código.

const editor = grapesjs.init({ Indica dónde iniciar el editor en el editor. También puedes aprobar un HTMLElement Contenedor: '#gjs', Consigue el contenido del lienzo directamente del elemento Como alternativa, podríamos usar: 'components: '<h1>¡Hello World Component!</h1>' `, fromElement: cierto, Tamaño del editor Altura: '300px', Ancho: '100%', Desactiva el gestor de almacenamiento por el momento storageManager: false, Evita cualquier panel por defecto paneles: { predeterminados: [] }, blockManager: { appendTo: '#blocks', Bloqueos: [ { id: 'Mi-Div', etiqueta: 'My Div', Contenido: { Tipo: 'Mi-Tipo-Entrada' } }, ] }, });

editor. DomComponents.addType('my-input-type', { Haz que el editor entienda cuándo asignar 'mi-input-type' isComponent: el => el.tagName === 'div',

Definición del modelo modelo: { Predeterminados: { etiquetaNombre: 'div', arrastrable: 'forma, forma *', // Solo puede caerse dentro de los elementos de 'forma' contenido: 'Cosas', Droppable: falso, // No se pueden colocar otros elementos dentro }

}, Vista: { etiquetaNombre: 'div', eventos: { haz clic en: 'clickOnElement' }, clickOnElement: () => { console.log(esto) this.model.components('hola') }

} });

### Código de conducta

- [X] Acepto seguir el Código de Conducta de este proyecto