Añadir atributos personalizados (datos-) a los recursos/imágenes al subir/seleccionar

Question

Hola, estoy haciendo todo lo posible por encontrar la mejor manera de hacerlo, pero necesito adjuntar dos etiquetas de datos HTML5 personalizadas a una imagen una vez seleccionada desde el gestor de recursos. Así: '''html <img src="path/to/img" data-entity-type="file" data-entity-uuid="some-uuid" /> Como no conseguí que funcionara, intenté añadirlos en el evento de actualización de componentes, pero dudo que eso sea devolver un valor para actualizarlos después de añadirlos. '''javascript editor...

Coyote6 · Accepted Answer

He encontrado una solución, pero seguro que hay una mejor que esta: '''javascript editor.on('component:update', (component) => { if (component.attributes.type == 'image' & typeof (assets[component.attributes.src]) != 'indefinido') { var thisAsset = assets[component.attributes.src]; var iframe = $('#gjs iframe'); $('.' + component.cid,iframe.contents()).attr('data-entity-uuid', thisAsset.uuid); } }); ``` Gracias.

artf · Answer

Tu solución solo actualiza el elemento dentro del lienzo y no su modelo (así que en tu código final no los verás). Cuando actualizas el modelo, su elemento visible se actualiza automáticamente, por ejemplo, '''js editor.on('component:update:src', component => { component.is('image') && component.addAttributes({'data-uuid': '...'}); }); ```

Coyote6 · Answer

¡Gracias! ¿Habrá alguna función en el futuro para añadir atributos durante la importación de activos? Solo tengo curiosidad.

Añadir atributos personalizados (datos-) a los recursos/imágenes al subir/seleccionar

Pregunta

Respuestas (3)

Preguntas y respuestas relacionadas

Ayuda para añadir imágenes al lienzo

Subir imágenes a la base de datos remota

Cómo almacenar los atributos "data-" en la etiqueta html del componente

¿La mejor manera de escuchar los cambios en el HTML final?

Plugins de pago que cumplen con este problema

Tutoriales relacionados

🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS

Explorar categorías de plugins