Estilos por DI en componentes
Puedes alternar clases, esto cambiará el selector de estilos ! Schermata 2019-11-30 alle 00 12:32
Lee la respuesta completa abajo ↓Pregunta
¿Cómo hago los estilos de los componentes? Los tomo por identificación y no por clase
Respuestas (2)
Puedes alternar clases, esto cambiará el selector de estilos ! Schermata 2019-11-30 alle 00 12:32
El principal problema que tengo es que intento hacer un redimensionamiento en un componente que he hecho, pero si tengo dos componentes iguales, cuando hago el redimensionamiento de uno de ellos el otro hace el mismo redimensionamiento. Así que creo que tendría que gestionar su estilo por identificación y no por clase.
Este es mi código:
'const buttonComponent = {
Nombre: "Button-BK",
data: {
id: "botón",
etiqueta: 'Botón',
categoría: "Componentes básicos",
Arrastrable: Cierto,
Contenido: '<Button Class="BTN-Builder" Data-GJS-Draggable=".cell" Data-GJS-Resizable='{"TL":0,"TC":0,"TR":0,"CL":0,"CR":1,"BL":0,"BR":0,"minDim":1,"bc":0,"UnitCurrent":1,"step":0.2}' data-gjs-name="Button">Send</button>',
},
};
editor. BlockManager.add('button', buttonComponent);
`
Ver ejemplo https://cl.ly/c4bfaf626adcPreguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #510
Añadir nueva clase programáticamente
Hola Artf, Quiero editar los estilos de los componentes (principalmente HTML importado) sin modificar todos los componentes con la misma cl...
Issue #2440
Redimensionar por clase :(
El principal problema que tengo es que intento hacer un redimensionamiento en un componente que he hecho, pero si tengo dos componentes igu...
Issue #6685
Los estilos de componentes personalizados no se aplican tras la eliminación y la re-suma
Versión GrapesJS [x] Confirmo que uso la última versión de GrapesJS ¿Qué navegador usas? Chrome v143.0.7499.193 Enlace de demo reproducible...
Issue #4503
Faltan estilos en línea usados por CKEditor al añadir componentes html en bruto
Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chromium v96 Enlace de demo reproducible...
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.