Bootstrap使用JQuery来触发定制事件hidden.bs.modal，因此它不容易被Vue捕获（我相信Vue在幕后使用了本机事件）。
由于您必须在页面上使用JQuery才能使用Bootstrap的本机模态，因此只需使用JQuery来捕获它。假设您向Bootstrap模态添加了一个ref="vuemodal"，则可以执行类似以下操作。

new Vue({
  el:"#app",
  data:{
  },
  methods:{
    doSomethingOnHidden(){
      //do something
    }
  },
  mounted(){
    $(this.$refs.vuemodal).on("hidden.bs.modal", this.doSomethingOnHidden)
  }
})

Working example .

请访问https://bootstrap-vue.js.org/docs/components/modal#overview，您可以在其中找到事件“hide”或“hidden”，以便绑定此事件：

<b-modal ref="someModal" @hide="doSometing">

一种选择是将其绑定到变量：

data: function(){
  return {
       showModal: false
        //starts as false.  Set as true when modal opens. Set as false on close, which triggers the watch function.
},
watch: {
  showModal: function(){
    if(this.showModal == false){
     // do something
  },
}

超文本标记语言

<button id="show-modal" @click="showModal = true">Show Modal</button>

 //later if using a component
<modal v-if="showModal" @close="showModal = false">

 // or alternatively in the bootstrap structure
<div class="modal-footer">
     <button type="button" class="btn btn-default" data-dismiss="modal" @click="showModal = false">Close</button>
</div>

这可能有点晚了，但是如果您正在使用已创建的自定义模态组件（Modal.vue），另一种方法是
1.在mounted中创建一个方法来捕获关闭事件（不必与下面的名称相同）

mounted: function(){
        this.triggerHidden();
    }

1.创建方法

methods: {
       triggerHidden: function(){
           var self = this;
           if( $('#getModal').length ){
               $('#getModal').on('hidden.bs.modal', function(){
                  //catch the native bootstrap close event and trigger yours
                  self.#emit('modal-close');
               });
           }
        }
    }

1.现在调用使用定制事件和定制/可重用模态组件
<custom-modal @modal-close="doSomething"></custom-modal>方法doSomething将在模态关闭时被调用。您也可以使用该方法劫持其他jquery事件，以便更易于管理。

创建自定义Vue指令可能会有所帮助：

Vue.directive('bsevent', {
   bind: function bsEventCreate(el, binding, vnode) {
      let method = binding.value || (() => { });
      $(el).on(binding.arg.replaceAll(/_/g, "."), (event) => { method(event); });
   },
   
   unbind(el, binding) {
      $(el).off(binding.arg.replace(/_/, "."));
   },
});

然后只在你想要的元素上使用它（这个例子是在一个可折叠的 Bootstrap 上，但是你可以在任何其他 Bootstrap 事件上使用它）：

<div id="myCollapsible" class="collapse" v-bsevent:hidden_bs_collapse="methodToCall">
  ...                           
</div>

唯一要记住的是用下划线而不是点来注册事件（show.bs.modal =〉show_bs_modal）。

如果使用bootstrap-vue，下面的代码片段将很有帮助：

export default {
  mounted() {
    this.$root.$on('bv::modal::hide', (bvEvent, modalId) => {
      console.log('Modal is about to be shown', bvEvent, modalId)
    })
  }
}

其它事件请参考official docs.

仅使用原生addEventListener（Vue 3，合成API）
模板：

<div ref="modalElement" class="modal">
...
</div>

脚本：

import { Modal } from "bootstrap"
import { onMounted, ref } from "vue";

const modalElement = ref(null)
let modal = null;

onMounted(() => {
  modal = new Modal(modalElement.value)
  modalElement.value.addEventListener("hidden.bs.modal", onHidden)
})

function onHidden() {
  // do something…
}