Fix: Eliminar re-renderizados innecesarios en accordiones
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m5s
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m5s
- Remover JSON.parse(JSON.stringify()) de accordionItems computed - Remover clonación innecesaria en obtenerMuestraPorValue - Pasar referencias directas en lugar de copias profundas - Los accordiones ahora mantienen su estado sin parpadeos - Mejora significativa en la fluidez de la interfaz El problema era que al clonar las muestras en cada render, Vue detectaba objetos "nuevos" y re-montaba completamente los componentes accordion, causando un efecto visual de parpadeo cada vez que se actualizaba un valor.
This commit is contained in:
@@ -239,7 +239,7 @@ const accordionItems = computed(() => {
|
||||
return sesionActiva.value.muestras.map((muestra) => ({
|
||||
label: '', // Usaremos slot #default para el contenido del header
|
||||
value: `muestra-${muestra.muestraId}`,
|
||||
muestra: JSON.parse(JSON.stringify(muestra)) as Muestra, // Datos extra para el template
|
||||
muestra, // Pasar referencia directa sin clonar
|
||||
}))
|
||||
})
|
||||
|
||||
@@ -249,9 +249,7 @@ const obtenerMuestraPorValue = (value: string): Muestra | null => {
|
||||
|
||||
// Extraer el ID de la muestra del value (formato: "muestra-{id}")
|
||||
const muestraId = parseInt(value.replace('muestra-', ''))
|
||||
const muestra = sesionActiva.value.muestras.find(m => m.muestraId === muestraId)
|
||||
if (!muestra) return null
|
||||
return JSON.parse(JSON.stringify(muestra)) as Muestra
|
||||
return sesionActiva.value.muestras.find(m => m.muestraId === muestraId) || null
|
||||
}
|
||||
|
||||
// Inicializar al montar
|
||||
|
||||
Reference in New Issue
Block a user