En una lista de navegación. Estoy agregando una clase al hacer clic, y desaparece cuando hago clic nuevamente. Es agregar la clase a todos los elementos de la lista. Solo deseo activar un elemento a la vez en Click. Además, tengo un clic con dos acciones (desplazarse y luego agregar una clase)

 <b-navbar class="d-flex flex-column align-items-start> <b-navbar-brand tag="h3" class="m-0">List Index</b-navbar-brand> <b-navbar-nav v-for="(linkItem, index) in linkItems" :key="index"> <b-nav-item :class="{ active: isActive }" class="pl-2" @click="scrollTo(`${linkItem.id}`), (isActive = !isActive)"> {{ linkItem.title }} </b-nav-item> </b-navbar-nav> </b-navbar>

Y los métodos son

 data() { return { isActive: false, linkContent: [] as any }; }, scrollTo { This is working fine}, activeLink() { this.isActive = true; } } });

Necesito ayuda para que la clase solo se aplique al elemento activo.

Gracias