Assets renderizando todas las imágenes en lugar de solo algunas.
¡Por supuesto! Aquí está: https://www.w3schools.com/code/tryit.asp?filename=GEQ2MIV7CI3W (Actualizado)
Lee la respuesta completa abajo ↓Pregunta
Hola @artf, primero que nada, ¡gran trabajo con el GrapesJS! Me lo estoy pasando muy bien trabajando con él. ¡Es increíble!
Así que, sobre el tema, o quizá aún soy nuevo en eso...
Situación: Quiero poder crear una galería usando el Gestor de Activos. Seguí los pasos para crear la lista y añadir algunas categorías.
Creé esta función para generar imágenes aleatorias para mí.
getAssets(cuánto: número): any[] {
activos const = [];
para (sea i = 0; i < cuántos; i++) {
const randomColor = Math.floor(Math.random() * 16777215).toString(16);
categoría const = i % 2 === 0 ? 1 : 2;
const img = {
Categoría: 'C' + Categoría,
tipo: 'imagen',
unitDim: 'px',
altura: 350,
Ancho: 250,
src: 'http://placehold.it/350x250/${randomColor}/fff/image${i + 1}.jpg',
};
assets.push(IMG);
}
devolver activos;
}
Y luego tengo esto:
const am = editor. Gestor de Activos;
am.add(this.getAssets(10));
activos const = am.getAll();
am.render(assets.filter((asset: any) => {
return asset.get('category') === 'c1';
}));
console.log('Todos los activos: ', am.getAll().longitud);
console.log('Todo visible: ', am.getAllVisible().longitud);
Las funciones que llamo 'getAll()' me dan 10, y 'getAllVisible()' me dan 5 como se supone que debía hacer. Pero cuando abro el modal del Gestor de Activos, se muestran las 10 imágenes, no solo las 5 que quería...
¿Debería crear mi propio modal y mostrar los visibles o el Administrador de Activos debería mostrar solo los visibles?
Respuestas (3)
¡Por supuesto! Aquí está:
https://www.w3schools.com/code/tryit.asp?filename=GEQ2MIV7CI3W
(Actualizado)
Gracias, @cartifon, sobre el problema, sinceramente, esperaría ver actualizado el Gestor de Assets, ¿puedes crear una demo en vivo reproducible para que pueda comprobarlo mejor?
'0.12.17' es demasiado antiguo, usa la última versión de grapesjs y funcionará
Preguntas y respuestas relacionadas
Continúa investigando con debates sobre temas similares.
Issue #386
Amplía ejemplos/documentación de Pannel/Command abriendo una nueva vista
Hola Artur, ¡Primero que nada, Grapesjs es increíble! Ahora mismo estoy intentando entender cómo crear un panel con un botón que abra una n...
Issue #1754
[Bug] problema de estilización con ckeditor(4)
¡Hola @artf todos! ¡Gracias de nuevo por el trabajo increíble! Intenté implementar ckeditor con grapesjs y parece funcionar bastante bien,...
Issue #444
¿Cómo cargar el enlace CSS en la etiqueta de cabeza?
Hola, Antes que nada, gracias por aportar un framework de js tan increíble. Soy muy nuevo en Grapesjs. Y también github. https://github.com...
Issue #428
Cambiar el fondo del cuerpo
Hola, Antes que nada, quiero daros las gracias por este proyecto increíble! Tengo algunas preguntas sobre el editor, y más concretamente so...
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.
Tutorial
Ship to Production Faster: What’s New in GrapesJS Shadcn
Supercharge your page builder! GrapesJS Shadcn adds live drag previews, rich text / commands, dynamic data, and canvas presets to ship to prod faster.
Tutorial
Embed GrapesJS in Your SaaS: A Weekend Guide
Embed GrapesJS in your SaaS and ship a white-label page builder over a weekend. Honest tradeoffs, real code, and the plugins that close the UX gap.
Tutorial
GrapesJS vs Webflow vs Tilda (2026): Honest Comparison, Pricing & Which to Pick
GrapesJS vs Webflow vs Tilda compared head-to-head: real 2026 pricing, SEO features, code export, and which one actually fits your project
Explorar categorías de plugins
Ve directamente a las páginas de categorías de plugins en el marketplace.