bootstrapvue 的tab组件，如何动态绑定禁止和开启

BootstrapVue 的 tab 组件可以通过绑定 :disabled prop 来动态禁止某个标签页。

可以在某个标签页元素上绑定一个变量来控制其是否被禁用。例如:

<b-tabs>
  <b-tab :disabled="tab1Disabled" title="Tab 1"></b-tab>
  <b-tab :disabled="tab2Disabled" title="Tab 2"></b-tab>
  <b-tab :disabled="tab3Disabled" title="Tab 3"></b-tab>
</b-tabs>

然后在组件的 data 中定义变量来控制禁用状态。

data() {
  return {
    tab1Disabled: false,
    tab2Disabled: true,
    tab3Disabled: false
  }
},

如果想要动态的开启标签页，可以在通过js程序修改相应的变量值

methods: {
  openTab1(){
    this.tab1Disabled = false;
  }
}

在组件中调用这个方法，就能开启第一个标签页。