vue3-bootstrap-tooltip-plugin.js

import { Tooltip } from 'bootstrap';
import { nextTick } from 'vue';

const attrName = 'data-bs-title';
const contextAttrName = '__v_bs_tooltip__';

export default {
  install(app, options) {
    app.directive('bs-tooltip', {
      mounted(el, binding, vnode, prevVnode) {
        el.setAttribute(attrName, `${binding.value}`);
        el[contextAttrName] = new Tooltip(el);
      },
      componentUpdated(el, binding, vnode, prevVnode) {
        nextTick(() => {
          el.setAttribute(attrName, `${binding.value}`);
          el[contextAttrName]._config.title = binding.value;
        });
      },
      unmounted(el, binding, vnode, prevVnode) {
        el[contextAttrName].dispose();
        delete el[contextAttrName];
        el.removeAttribute(attrName);
      },
    })
  },
}