Dropdown add new trigger contextMenu

src/components/dropdown/dropdown.vue

@@ -4,7 +4,7 @@
         v-click-outside="onClickoutside"
         @mouseenter="handleMouseenter"
         @mouseleave="handleMouseleave">
-        <div :class="[prefixCls + '-rel']" ref="reference" @click="handleClick"><slot></slot></div>
+        <div :class="relClasses" ref="reference" @click="handleClick" @contextmenu.prevent="handleRightClick"><slot></slot></div>
         <transition name="transition-drop">
             <Drop
                 :class="dropdownCls"
@@ -33,7 +33,7 @@
         props: {
             trigger: {
                 validator (value) {
-                    return oneOf(value, ['click', 'hover', 'custom']);
+                    return oneOf(value, ['click', 'hover', 'custom', 'contextMenu']);
                 },
                 default: 'hover'
             },
@@ -60,6 +60,14 @@
                 return {
                     [prefixCls + '-transfer']: this.transfer
                 };
+            },
+            relClasses () {
+                return [
+                    `${prefixCls}-rel`,
+                    {
+                        [`${prefixCls}-rel-user-select-none`]: this.trigger === 'contextMenu'
+                    }
+                ];
             }
         },
         data () {
@@ -89,6 +97,13 @@
                 }
                 this.currentVisible = !this.currentVisible;
             },
+            handleRightClick () {
+                if (this.trigger === 'custom') return false;
+                if (this.trigger !== 'contextMenu') {
+                    return false;
+                }
+                this.currentVisible = !this.currentVisible;
+            },
             handleMouseenter () {
                 if (this.trigger === 'custom') return false;
                 if (this.trigger !== 'hover') {
@@ -113,6 +128,7 @@
             },
             onClickoutside (e) {
                 this.handleClose();
+                this.handleRightClose();
                 if (this.currentVisible) this.$emit('on-clickoutside', e);
             },
             handleClose () {
@@ -122,6 +138,13 @@
                 }
                 this.currentVisible = false;
             },
+            handleRightClose () {
+                if (this.trigger === 'custom') return false;
+                if (this.trigger !== 'contextMenu') {
+                    return false;
+                }
+                this.currentVisible = false;
+            },
             hasParent () {
 //                const $parent = this.$parent.$parent.$parent;
                 const $parent = findComponentUpward(this, 'Dropdown');

src/styles/components/dropdown.less

@@ -16,6 +16,11 @@
     &-rel{
         //display: inline-block;
         position: relative;
+        &-user-select-none{
+            -webkit-user-select: none;
+            -moz-user-select: none;
+            user-select: none;
+        }
     }
 
     &-menu{