Vuejs:当特定选项卡激活时会发出事件(boostrap-vue)

问题描述 投票:0回答:1

我想在特定的b-tab处于活动状态时显示和隐藏div(页面中的一部分),并在非活动的b-tab处于关闭状态时关闭它(打开和关闭通过两种方法实现-forceOpenSettings和forceCloseSettings)。特定选项卡激活时是否发出事件。这样我就可以将其链接到这些方法。当我检查bootstrap-vue文档时找不到任何内容。我发现的最接近的东西是-https://bootstrap-vue.org/docs/components/tabs#programmatically-activating-and-deactivating-tabs

尝试使用本节中介绍的激活和停用功能,但不起作用

<b-tab title="User Table" @activate="forceOpenSettings" @deactivate="forceCloseSettings"></b-tab>

工作正常的情况下

同一件事在这里工作正常。我想打开和关闭相同的div,但是这次基于b折叠。在b-collapse的bootstrap-vue文档中,我可以找到@hide和@show事件发射器-https://bootstrap-vue.org/docs/components/collapse#comp-ref-b-collapse-events。尝试使用它,它工作正常。我想要的是一个类似于该选项卡处于活动状态而未处于活动状态时的事件发射器。

<b-collapse role="tabpanel" @show="forceOpenSettings" @hide="forceCloseSettings"></b-collpase>

NB-显示和隐藏的部分是页面中的另一部分,不是b-tabs或b-collapse的子级。我只想基于此选项卡打开和关闭该div并合拢。折叠正常,但选项卡无效。

如果没有事件发射器,也许我应该写一个方法来实现这一目标。但是,如果Vuejs有一些事件发射器可以实现这一点,那就太好了。

javascript vue.js click eventemitter vue-bootstrap
1个回答
0
投票

尝试这样的事情:

<b-tabs @input="onTabChange" ...
...
methods: {
  onTabChange () {
    // tab is changed!
  }
}
© www.soinside.com 2019 - 2024. All rights reserved.