vue seperate tab content to external tab
<b-dd text="Change tab" class="mb-3">
<b-dd-item @click="tabIndex = 0">Page 1</b-dd-item>
<b-dd-item @click="tabIndex = 1">Page 2</b-dd-item>
<b-dd-item @click="tabIndex = 2">Page 3</b-dd-item>
<b-dd-item @click="tabIndex = 3">Page 4</b-dd-item>
</b-dd>
<b-tabs id="myTabs" v-model="tabIndex" nav-wrapper-class="d-none">
<b-tab>I'm the first tab</b-tab>
<b-tab>I'm the second tab</b-tab>
<b-tab>I'm the third tab</b-tab>
<b-tab>I'm the fourth tab</b-tab>
</b-tabs>
<script>
new Vue({
el: "#app",
data: {
tabIndex: 0
}
});
</script>