Celda editable
Mi solución: '''s editor. Components.addType('cell', { isComponent(el) { si (!( ['td', 'th'].indexOf(el.tagName?. toLowerCase()) >= 0)) { return false; } const allChildNodes: Node[] = []; function collectChildNodes(arr: Node) { const { childNodes } = arr; si (childNodes.length > 0) { para (sea índice = 0; índice < chi...
Lee la respuesta completa abajo ↓Pregunta
Hola, Estoy usando GrapesJS para newsletters (con el plugin gjs-preset-newsletter) y tengo un problema al importar código. No puedo editar las cajas del tipo 'celda' (tds, trs...). Leí que es un parámetro e intenté cambiarlo, sin éxito. ¿Hay alguna forma de hacerlo sin cambiar el código fuente?
Respuestas (3)
Mi solución:
'''s editor. Components.addType('cell', { isComponent(el) { si (!( ['td', 'th'].indexOf(el.tagName?. toLowerCase()) >= 0)) { return false; }
const allChildNodes: Node[] = []; function collectChildNodes(arr: Node) { const { childNodes } = arr; si (childNodes.length > 0) { para (sea índice = 0; índice < childNodes.length; índice += 1) { const arrayNodeChildNode = childNodes[index]; si (arrayChildNode.childNodes?. longitud > 0) { collectChildNodes (arrayChildNode); } else { allChildNodes.push (arrayChildNode); } } } else { allChildNodes.push(arr); } } collectChildNodes(el);
return !allChildNodes.every( (ítem) => nodo.tipo === 3 || ¿nombre.nodo?. toLowerCase() === 'br', ); }, });
Recoge todos los childNodes, si todos los childNodes son textNode o elemento 'br', creo que no es un td, devuelven a un Text Wrapper y el usuario puede editar el contenido
Deberías envolver el texto con otra etiqueta. Si no puedes cambiar el contenido, probablemente deberías tener que extender el componente original Por ejemplo, dentro de isComponent puede hacer algún tipo de cambio '''js isComponent(el) { Sea resultado = ''; etiqueta const = el.etiquetaNombre;
if (tag == 'TD' || tag == 'TH') { resultado = { Tipo: 'Célula', etiquetaNombre: etiqueta.toLowerCase() };
si ( /* por ejemplo, el tiene un elemento de nodo de texto */ ) { result.components = '<div>${el.innerText}</div>' } }
resultado de retorno; }
Tengo el mismo problema, estoy esperando la respuesta... #1257
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #3699
El flotamiento de la celda desplaza aleatoriamente a la celda real
¡Hola! Estoy usando grapesJs para editar correos electrónicos en un proyecto de mi empresa, con el plugin Newsletter. Todo funciona muy bie...
Issue #4273
Cómo activar la 'Importar plantilla (modal)' al cargar la página
Hola, Por favor, necesito la lógica para importar la plantilla modal al inicializar la página... Estoy usando el plugin de presets del bole...
Issue #2960
BUG: La interfaz para las propiedades de margen y relleno dentro del sector
Hola, Estoy creando un sector solo para margen y relleno con el código que aparece a continuación: Y el sector se crea con Propiedades de M...
Issue #2850
[PREGUNTA] Añadir un desplegable para bloquear usando Rasgos
Hola @artf, Espero que estés bien, Me preguntaba si podríais ayudarme con algún problema sencillo que estoy teniendo (recientemente he empe...
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.