Haz que el estilo CSS no sea devuelto
Pregunta
Cómo evitar que el CSS de un bloque/componente no se devuelva cuando usamos 'editor.getCss();'
Es como 'https://grapesjs.com/docs/api/component.html#tohtml'
pero debería ser algo como toCSS dentro de un componente personalizado
Respuestas (3)
toHTML() {
regresar '';
},
toCSS() {
regresar '';
},
El componente tiene el método 'getStyle' que devuelve un objeto como este '{ color: 'red'}'. Si el objeto que devuelve está vacío, no se creará ninguna regla en el código, pero se aplica lo mismo en el lienzo, así que no verás tus estilos.
Lo que puedes hacer es crear un componente personalizado así: '''js domc.addType('no-css-in-code', { modelo: { ... getStyle() { if (exportingCode) { return {} } else { return defaultModel.prototype.getStyle.apply(this); } } }, });
Así que antes de exportar el código puedes usar 'exportingCode' como una bandera
@artf la solución "getStyle()" que proporcionaste solo puede aplicarse a la solución
estilo: {
"eventos puntero": "ninguno";
},
¿y si este componente tiene una clase de "isNewComponent" y tiene un estilo de
.isNewComponent{
Color de fondo: #222;
}
es posible que el editor no incluya el estilo anterior (con una clase) cuando llamamos editor.getCss();
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #868
[BUG]: el evento "component:add" se activa cuando se mueven componentes
Tomado de https://github.com/artf/grapesjs/wiki/API-Editorcomponent:add - Se activa cuando se añade un nuevo componente al editor, el model...
Issue #1033
[BUG]: Cuando se usan IDs, no es posible actualizar o eliminar un estilo
Pasos para reproducirsehttps://jsfiddle.net/1cjjr02p/Haz clic en el texto del editor, cambia el color de fondo.Exportar CSS. Verás que exis...
Issue #5746
El desplazamiento de ColorPicker incorrecto cuando los paneles están fuera del contenedor del editor
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome v122 Enlace de demo reproducible h...
Issue #3579
RTE se pierde al abrirse justo después de soltar el componente 'activeOnRender'
Versión: 0.17.4 ¿Puedes reproducir el error de la demo?[x] Sí[ ] No Pasos para reproducir:Ir a la demoColocar un bloque de "Texto" dentro d...
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.
Tutorial
Ship to Production Faster: What’s New in GrapesJS Shadcn
Supercharge your page builder! GrapesJS Shadcn adds live drag previews, rich text / commands, dynamic data, and canvas presets to ship to prod faster.
Tutorial
Find the Right GrapesJS Plugin in Seconds: Smarter Discovery Is Live
We're shipping a set of discovery upgrades. New label filters, a proper compatibility switch for GrapesJS vs Studio, one-click and a smarter sort bar.
Tutorial
Preset DevFuture 2.0 — New Update Released
Preset continues evolving as a clean, production-ready starting point for building visual editors powered by GrapesJS
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.