#Encontraste ya el por qué

1 messages · Page 1 of 1 (latest)

hot raptor
#

no u.u

#

Hice uno de prueba (sin for) y de esta manera al darle click a uno cierra el otr, lo cual me sirve

#

pero al volver a mi for no actua de esa manera

novel zinc
#

y por qué no lo haces pasando un true false en una variable ref?

#

en vez de manipular clases

#

el div que tenga como padre al v-for

#

le pones un v-if=selectedTab

#

v-if=selectedTab === 'xxx' el nombre que le pongas a la tab

#

y en el click

#

toggleTab = (tab) => {
selectedTab.value = tab
}

#

si quieres te llevas la expresión del v-if al script

#

y la encierras en una constante
const showTab = (tab) => {
return selectedTab.value === tab;
}

#

entonces en el v-if te queda
v-if="showTab('nombreTab')"

#

y ya lo único que tienes que hacer es poner cualquier nombre a cada tab en el showTab y en el click y ya

#

andando

#

luego los estilos los puedes basar en el valor de selectedTab en la template

#

si es o no igual, true/false, x estilo

novel zinc
#

quedaría así
const selectedTab = ref(null)
const toggleTab = (tab) => {
return selectedTab.value = tab;
}
const showTab = (tab) => {
return selectedTab.value === tab;
}

#

y los divs de ejemplo
<div v-for="tab,index in tabs" :key="`tab-${index}">
...