1

Tengo una card cuyo btn para poder ser expandida es el siguiente (code HTML generado):

<button data-v-5d473948="" type="button" data-toggle="collapse" aria-expanded="false" data-target="#module-collapse-" aria-controls="module-collapse-" class="btn btn-primary btn-circle btn-toggle-collapse collapsed"><i data-v-5d473948="" class="icon ion-chevron-up"></i> <i data-v-5d473948="" class="icon ion-chevron-down"></i></button>

Code en mi componente de VUE.js:

<button class="btn btn-primary btn-circle btn-toggle-collapse"
  type="button"
  data-toggle="collapse"
  aria-expanded="false"
  data-target="#module-collapse-"
  aria-controls="module-collapse-"
  >
    <i class="icon ion-chevron-up"></i>
    <i class="icon ion-chevron-down"></i>
</button>

El problema que tengo es que a veces hay muchas cards, y cada card tiene un btn de esos, cuando intento expandir la segunda o tercera card, se expanden todas.

1 respuesta 1

2

Con la información suministrada y asumiendo que estás utilizando Bootstrap 4.6.

Esto lo más seguro se deba a que no has modificado los atributos data-target de tus botones o los identificadores de las cards.

Podrás encontrar un poco más de documentación en la página web de bootstrap en su versión 4.6 correspondiente al tema del uso de 'collapse'. Enlace aquí.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.