Permitir la edición de nodos de texto
Pregunta
Problema: los nodos de texto que no tienen padre no son editables. Los nodos de texto que tienen un padre pero también un hermano (por ejemplo, un span), tampoco son editables. Es necesario que los nodos de texto en bruto soporten el soporte de los nodos.
Ejemplo que no funciona:
<div id="gjs">
<div class="glyphicon glyphicon-asterisk"></div> Intenta editarme
</div>
El comportamiento esperado es que el nodo de texto 'Intentar editarme' pueda ser editado. El comportamiento real es que no se puede editar.
JSFiddle para reproducir: https://jsfiddle.net/szLp8h4n/107/
Respuestas (3)
Esto es para arreglar texto que no está envuelto en un espacio para que el componente sea editable
const updateLooseTextComponents = function(components: [any]) {
para (componente const de componentes) {
si (component.type === 'textnode') {
component.type = 'texto';
component.tagName = 'span';
}
si (component.components) {
updateLooseTextComponents(component.components);
}
}
};
updateLooseTextComponents(components);
const td = template.template_data como cualquiera;
td['gjs-components'] = JSON.stringify(components);
@artf '<gjs-text-node>' ¡parece una buena solución!
Conscientes y de acuerdo, la pregunta es simplemente '¿Cómo?'. Los nodos de texto no tienen la propiedad 'contentEditable', así que probablemente tendremos que intentar envolverlos todos dentro de '<span>'s (solo en su Vista) y ver cómo se gestiona todo
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #460
Cuando la vista del componente modifica el HTML, los componentes de texto ya no son editables
Estoy intentando crear un componente personalizado que contenga algo de texto lorem ipsum en el contenido, para editarlo una vez que esté e...
Issue #3603
Problema en la edición de texto. Texto no seleccionado de nuevo si elimina
Antes que nada, gracias por la gran herramienta @artf. Mientras estoy trabajando en un proyecto. Tengo un problema al editar texto. Si sele...
Issue #2194
Los bloques CKEditor no son editables[PREGUNTA]
Hola a todos, He añadido los bloques personalizados de CKEditor y funciona perfectamente. pero el problema real es que no puedo eliminar, m...
Issue #3783
Texto superpuesto RTE cuando el componente de texto está al 100% de altura
Versión GrapesJS Por favor, ayudadme; puede que esto se haya solucionado en algún sitio, pero revisé los problemas y no encontré ninguno; h...
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.