mirror of https://github.com/ElemeFE/element
				
				
				
			Tooltip: move event handlers adding to the mounted hook (#9336)
							parent
							
								
									2880132de8
								
							
						
					
					
						commit
						3fffdd1534
					
				| 
						 | 
				
			
			@ -1,6 +1,6 @@
 | 
			
		|||
import Popper from 'element-ui/src/utils/vue-popper';
 | 
			
		||||
import debounce from 'throttle-debounce/debounce';
 | 
			
		||||
import { addClass, removeClass } from 'element-ui/src/utils/dom';
 | 
			
		||||
import { addClass, removeClass, on, off } from 'element-ui/src/utils/dom';
 | 
			
		||||
import { getFirstComponentChild } from 'element-ui/src/utils/vdom';
 | 
			
		||||
import { generateId } from 'element-ui/src/utils/util';
 | 
			
		||||
import Vue from 'vue';
 | 
			
		||||
| 
						 | 
				
			
			@ -101,15 +101,8 @@ export default {
 | 
			
		|||
    if (!vnode) return vnode;
 | 
			
		||||
 | 
			
		||||
    const data = vnode.data = vnode.data || {};
 | 
			
		||||
    const on = vnode.data.on = vnode.data.on || {};
 | 
			
		||||
    const nativeOn = vnode.data.nativeOn = vnode.data.nativeOn || {};
 | 
			
		||||
 | 
			
		||||
    data.staticClass = this.concatClass(data.staticClass, 'el-tooltip');
 | 
			
		||||
    nativeOn.mouseenter = on.mouseenter = this.addEventHandle(on.mouseenter, this.show);
 | 
			
		||||
    nativeOn.mouseleave = on.mouseleave = this.addEventHandle(on.mouseleave, this.hide);
 | 
			
		||||
    nativeOn.focus = on.focus = this.addEventHandle(on.focus, this.handleFocus);
 | 
			
		||||
    nativeOn.blur = on.blur = this.addEventHandle(on.blur, this.handleBlur);
 | 
			
		||||
    nativeOn.click = on.click = this.addEventHandle(on.click, () => { this.focusing = false; });
 | 
			
		||||
 | 
			
		||||
    return vnode;
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -118,6 +111,11 @@ export default {
 | 
			
		|||
    if (this.$el.nodeType === 1) {
 | 
			
		||||
      this.$el.setAttribute('aria-describedby', this.tooltipId);
 | 
			
		||||
      this.$el.setAttribute('tabindex', 0);
 | 
			
		||||
      on(this.referenceElm, 'mouseenter', this.show);
 | 
			
		||||
      on(this.referenceElm, 'mouseleave', this.hide);
 | 
			
		||||
      on(this.referenceElm, 'focus', this.handleFocus);
 | 
			
		||||
      on(this.referenceElm, 'blur', this.handleBlur);
 | 
			
		||||
      on(this.referenceElm, 'click', this.removeFocusing);
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  watch: {
 | 
			
		||||
| 
						 | 
				
			
			@ -147,14 +145,8 @@ export default {
 | 
			
		|||
      this.focusing = false;
 | 
			
		||||
      this.hide();
 | 
			
		||||
    },
 | 
			
		||||
    addEventHandle(old, fn) {
 | 
			
		||||
      if (!old) {
 | 
			
		||||
        return fn;
 | 
			
		||||
      } else if (Array.isArray(old)) {
 | 
			
		||||
        return old.indexOf(fn) > -1 ? old : old.concat(fn);
 | 
			
		||||
      } else {
 | 
			
		||||
        return old === fn ? old : [old, fn];
 | 
			
		||||
      }
 | 
			
		||||
    removeFocusing() {
 | 
			
		||||
      this.focusing = false;
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    concatClass(a, b) {
 | 
			
		||||
| 
						 | 
				
			
			@ -192,5 +184,14 @@ export default {
 | 
			
		|||
      }
 | 
			
		||||
      this.expectedState = expectedState;
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
  destroyed() {
 | 
			
		||||
    const reference = this.referenceElm;
 | 
			
		||||
    off(reference, 'mouseenter', this.show);
 | 
			
		||||
    off(reference, 'mouseleave', this.hide);
 | 
			
		||||
    off(reference, 'focus', this.handleFocus);
 | 
			
		||||
    off(reference, 'blur', this.handleBlur);
 | 
			
		||||
    off(reference, 'click', this.removeFocusing);
 | 
			
		||||
  }
 | 
			
		||||
};
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue