Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- // under script
- // simple dumb component called Tooltip has been created that takes props text and className
- import Tooltip from '~/components/Tooltip.vue'
- import Vue from 'vue'
- // under methods....
- insertCopyTooltip: function(row, index){
- // dynamically insert tooltip!
- // if tooltip already inserted, delete it from Vue and from the DOM
- if( !!this.tooltipInstance ){
- console.log(this.tooltipInstance);
- this.tooltipInstance.$destroy();
- this.tooltipInstance.$el.parentNode.removeChild(this.tooltipInstance.$el);
- }
- // create the vue component ( instantiate the component and add it to the DOM)
- let span = document.createElement("span");
- let container = this.$refs['tooltipContainer'].appendChild(span);
- //Vue extend to create component class (creating a "subclass constructor of Vue")
- let toolTipClass = Vue.extend(Tooltip);
- // auth the component, passing it props
- let instance = new toolTipClass({ propsData: { text: "Copied!", className: "tooltip-fade" }});
- //mount the component in the DOM
- instance.$mount(container);
- this.tooltipInstance = instance;
- }
Add Comment
Please, Sign In to add comment