1<template>
2 <div>
3 <b-card no-body>
4 <b-tabs v-model="tabIndex" card>
5 <b-tab title="Tab 1" :title-link-class="linkClass(0)">Tab contents 1</b-tab>
6 <b-tab title="Tab 2" :title-link-class="linkClass(1)">Tab contents 2</b-tab>
7 <b-tab title="Tab 3" :title-link-class="linkClass(2)">Tab contents 3</b-tab>
8 </b-tabs>
9 </b-card>
10 </div>
11</template>
12
13<script>
14 export default {
15 data() {
16 return {
17 tabIndex: 0
18 }
19 },
20 methods: {
21 linkClass(idx) {
22 if (this.tabIndex === idx) {
23 return ['bg-primary', 'text-light']
24 } else {
25 return ['bg-light', 'text-info']
26 }
27 }
28 }
29 }
30</script>