#Encontraste ya el por qué
1 messages · Page 1 of 1 (latest)
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
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
y claro: antes de nada:
selectedTab = ref(null)
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}">
...