[Vuejs]-How to render plugins jQuery (as tooltip and Switchery) with Vue.js on a Bootstrap Modal?

by

5👍

✅

Nobody!! hahahahaa Now that I’ve learned better how to work with view I will share my solution trying to help someone!

Just did 2 directives to make it work!

About Switchery
I gave up from this jquery plugin and did by my own I component! You can checkout on this post
Wrapping Switchery in a Directive VueJS

About tooltip

import Vue from 'vue';

Vue.directive('plTooltip', {
  params: [
    'animation',
    'container',
    'html',
    'placement',
    'trigger',
  ],

  bind: function() {
    $(this.el).tooltip({
      animation: this.params.animation || true,
      container: this.params.container || false,
      html: this.params.html || false,
      placement: this.params.placement || 'top',
      title: this.vm.$t(this.expression) || '',
      trigger: this.params.trigger || 'hover focus',
    });
  },
  unbind: function() {
    $(this.el).tooltip('destroy');
  }
});

I hope it helps someone!

👤Gustavo Bissolli

Leave a comment