如何使用 bootstrap-vue 中可用的 "close" 功能折叠功能

Question

这就是我所说的崩溃

this.$root.$emit('bv::toggle::collapse', 'my-collapse-id')

但是如果我们点击同一个按钮它会同时打开和关闭，我想用关闭功能关闭折叠，目的是在关闭折叠时执行一些操作。

有没有在bootstrap-vue中使用close折叠功能的例子？官网没有例子docs.

Answer 1

to perform something at the time of closing the collapse

不要改变切换或尝试使用关闭功能，只需使用 <b-collapse> 在它开始关闭时发出的 @hide event 来触发您想要的任何东西：

<b-collapse visible @hide="foo()">
  <b-card>C O N T E N T</b-card>
</b-collapse>

...
<script>
...
methods: {
  foo() {
    // do stuff
  },
},

这样，只要折叠开始关闭，hide 事件就会触发，您的方法会运行。

另一件需要注意的事情是，您链接的 close 函数是在 <b-collapse> 的作用域插槽中向儿童公开的东西，因此您无论如何都无法在该上下文之外调用它.

如何使用 bootstrap-vue 中可用的 "close" 功能 折叠功能