Issue #2303💬 RespondidoAbierto el 2 de octubre de 2019por megargReacciones 2

Actualización a HTML de un nuevo componente personalizado

Respuesta rápidapor megarg1

Lo solucioné haciendo lo siguiente toHTML: function () { Sea el = '<script> console.log ("añadir escritura aquí") </script>'; el = defaultType.model.prototype.toHTML.apply(this) + el; devuelve El; }, Muchas gracias por tu apoyo

Lee la respuesta completa abajo ↓

Pregunta

Me gustaría cambiar cómo se produce el formato toHTML. Me gustaría modificar la salida html existente.

Probé la propiedad "toHTML" de component

  • permite devolver un nuevo elemento HTML
  • pero no permite obtener HTML existente y luego actualizarlo y devolverlo

Intenté llamar a toHTML dentro de toHTML para acceder al HTML original del componente, pero como era de esperar, entró en un bucle infinito.

¿Hay alguna forma de acceder a toHTML existente para poder modificarlo y luego devolverlo como nuevo "toHTML:. El editor o la exportación usarán la nueva salida.

Respuestas (3)

megarg3 de octubre de 2019
Fragmento de códigoTEXT
Lo solucioné haciendo lo siguiente
`
toHTML: function () {
        Sea el = '<script> console.log ("añadir escritura aquí") </script>';
        el = defaultType.model.prototype.toHTML.apply(this) + el;
        devuelve El;
      },
`

Muchas gracias por tu apoyo
scott-coates12 de noviembre de 2019

Para obtener 'defaultType' ejecuta esto: 'var defaultType = editor. DomComponents.getType('default');'

Y esto también funciona:

'''javascript var prototype = Object.getPrototypeOf(this); var el = prototype.proto.toHTML.call(this); devuelve El;

pouyamiralayi2 de octubre de 2019

¡Hola! ¿has probado a usar ''component.view.el'' dentro de tu ''toHTML''? te dará acceso al 'DOM' actual. ¡Salud!

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

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 →
Opción premium

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.