Hacer que los elementos internos no sean movibles con propagar
Puedes colocar otro componente personalizado en el centro que propague esas propiedades y también el 'arrastrable' o, como el droppable es falso en todos los componentes, puedes simplemente actualizar todos los componentes internos en init '''js const doTheThing = items => items.forEach(item => { item.set({ arrastrabl...
Lee la respuesta completa abajo ↓Pregunta
Hola, al crear un componente/bloque, queremos que los elementos internos no sean eliminados, editados ni movidos:
No se han eliminado ni editado, ¿vale? ¿Cómo hacer que no sean móviles?
¡Gracias!
$.get( "/iscrizionePrivacy.plp?a=VGsflaU2d7D0sUcDhl7lCkkX8tE1UW9kBzLcqcUAR_8-yKo74nLUmyXKrfIUst_kUirvlSC_A5sqeHrBsznmUg&locale=it_IT&fromBE=true", function( data ) {
editor. DomComponents.addType('eb-privacy', {
Haz que el editor entienda cuándo asignar 'mi-input-type'
isComponent: el => el.tagName === 'ENTRADA',
Definición del modelo
modelo: {
Propiedades predeterminadas
Predeterminados: {
etiquetaNombre: 'entrada',
arrastrable: 'forma, forma *', // Solo puede caerse dentro de los elementos de 'forma'
Droppable: falso, // No se pueden colocar otros elementos dentro
editable: false,
removible: falso,
redimensionable: cierto,
propagar: ['droppable', 'editable', 'removible'],
Componentes: Datos
}
}
});
editor. BlockManager.add('test-COMPONENT-PRIVACY', {
etiqueta: 'prueba-COMPONENT-PRIVACIDAD',
contenido: '<div data-gjs-type="eb-privacy">Componente de privacidad de prueba</div>',
});
});Respuestas (3)
Puedes colocar otro componente personalizado en el centro que propague esas propiedades y también el 'arrastrable' o, como el droppable es falso en todos los componentes, puedes simplemente actualizar todos los componentes internos en init '''js const doTheThing = items => items.forEach(item => { item.set({ arrastrable: false, removible: false, ... }) doTheThing(item.components()); }); editor. DomComponents.addType('eb-privacy', { ... Defaults: { ... },
init() { doTheThing(this.components()); } ...
Siguiendo las copias de código solo "........ doTheThing 3......" Parece que no se llama init()
'$.get( "/iscrizionePrivacy.plp?a=VGsflaU2d7D0sUcDhl7lCkkX8tE1UW9kBzLcqcUAR_8-yKo74nLUmyXKrfIUst_kUirvlSC_A5sqeHrBsznmUg&locale=it_IT&fromBE=true", function( data ) {
const doTheThing = items => items.forEach(item => {
item.set({ arrastrable: false })
console.log (" ........ doTheThing 2...... ");
doTheThing(item.components());
});
console.log (" ........ hacer LaCosa 3...... ");
editor. DomComponents.addType('eb-privacy', {
Haz que el editor entienda cuándo asignar 'mi-input-type'
isComponent: el => el.tagName === 'ENTRADA',
Definición del modelo
modelo: {
Propiedades predeterminadas
Predeterminados: {
etiquetaNombre: 'entrada',
arrastrable: 'forma, forma *', // Solo puede caerse dentro de los elementos de 'forma'
Droppable: falso, // No se pueden colocar otros elementos dentro
editable: false,
removible: falso,
redimensionable: cierto,
propagar: ['droppable', 'editable', 'removible'],
Componentes: Datos
},
init() {
console.log (" ........ hacer LaCosa 1...... ");
doTheThing(this.components());
}
}
});
editor. BlockManager.add('test-COMPONENT-PRIVACY', {
etiqueta: 'prueba-COMPONENT-PRIVACIDAD',
contenido: '<div data-gjs-type="eb-privacy">Componente de privacidad de prueba</div>',
});
});`Tienes que usar el componente del lienzo
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #1748
Cómo evitar que los elementos arrastren dentro del editor
Hola @artf Lo estás haciendo muy bien con grapesjs y es extremadamente útil hacer que nuestra funcionalidad sea más fácil de usar. Gracias...
Issue #1483
[PREGUNTAS] Haz un componente que no se pueda eliminar.
Hola, ¿Es posible crear un componente que no se pueda quitar o sin quitar el icono de la traqueoscopia al hacer clic? Gracias, espero con g...
Issue #2359
Modo absoluto, el estilo del componente desaparece al arrastrarse al lienzo
Hola chicos, estoy trabajando con grapesjs, cuya versión es '0.15.8', y en modo 'absoluto', cuando arrastro un bloque al lienzo, noto que f...
Issue #2297
[Pregunta] Añade un script usando arrastrar y soltar que añadirá elementos dinámicamente
Hola. Gracias por este gran proyecto. Lo estoy usando en uno de mis proyectos y necesito ayuda. 1- Tengo un elemento de bloque con un scrip...
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 →Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.