如何在Vue js中随处初始化bootstrap tooltip

问题描述

我尝试在 vue cli 中全局初始化引导工具提示。所以我把这行代码放在 App.vue 'mounted hook' 中：

let tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
let tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
  return new bootstrap.Tooltip(tooltipTriggerEl)
})

在这里我得到引导程序是未定义的错误。和

this.$jQuery('[data-bs-toggle="tooltip"]').Tooltip();

没有错误但不起作用。

我像这样在“main.js”中导入库：

// popper
import popper from "vue-popperjs/dist/vue-popper.min";
// bootstrap
import bootstrap from "bootstrap/dist/css/bootstrap.rtl.min.css";
import bootstrapJs from "bootstrap/dist/js/bootstrap.min";

Vue.use(bootstrap);
Vue.use(popper);
Vue.use(bootstrapJs);

和 jQuery 已经被首先导入。我正在使用 vuejs 2 和 bootstrap 5。BS doc 推荐使用第一个代码。也许我的方法不适合这样做，或者我导入的库是错误的。我想不通。所以任何答案都值得赞赏:-)

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bootstrap-popover vue-cli