Vue.js 如何在 vue 路由中导航到 Bootstrapvue 选项卡中的特定选项卡

<b-tabs>
  <b-tab title="Exotic Dogs" href="#dogs">
    <br>Dogs here
  </b-tab>
  <b-tab title="Exotic Cats"  href="#cats">
    <br>Cats here
  </b-tab>

</b-tabs>

{
        path: '/animals/:id#cats',
        name: 'getCats',
        component: Animals // removed from HTML to simplify
    },

this.$router.replace({ name: 'getCats', params: { id: this.$route.params.id }})

<b-tabs v-model="tabIndex">
  <b-tab title="Exotic Dogs" href="#dogs">
    <br>Dogs here
  </b-tab>
  <b-tab title="Exotic Cats"  href="#cats">
    <br>Cats here
  </b-tab>

</b-tabs>

export default {
  ...
  data() {
    return {
      tabIndex: 0,
      tabs: ['#dogs', '#cats']
    }
  },
  mounted() {
    this.tabIndex = this.tabs.findIndex(tab => tab === this.$route.hash)
  }
  ...
}

Vue.js相关问答推荐

如何在与父集合相同的读取中取回子集合(或重构数据？)

vuejs：在确认提示之前更改 HTML

保持页面重新加载之间的状态

Vue 3使用计算(computed)属性对象获取图像信息，在模板中呈现值时变为NaN

通过元素加中的正则表达式输入电话号码格式

为什么我在 Vue npm run serve 的 localhost 中得到无法获取

如何使用 vue.js 和 vue 路由实现当前路由的子菜单的子菜单

如何在 Vue 中编译从外部 api 加载的模板

带有外部配置文件的 Vue js

如何使用 vue-resource 添加额外的标头来发布请求？

Vue.js 如果在视图中

VueJS 通过渲染传递数据

当 v-for 与对象的属性一起使用时，将 v-model 与复选框一起使用

VS代码中的红点是什么意思

如何让 Vue 在 shadow dom 中工作

Laravel 和 Vue - handler.call 不是函数

更改事件上的 Select2 在 Vuejs 中不起作用

Vue js在列表中添加动态字段，删除和排序不起作用

Vue Cli 3：定义的输出路径

在 Vue 应用程序中创建一个类的单个实例