dropdown-menu.vue
1.32 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<template>
<transition name="el-zoom-in-top" @after-leave="doDestroy">
<ul class="el-dropdown-menu el-popper" :class="[size && `el-dropdown-menu--${size}`]" v-show="showPopper">
<slot></slot>
</ul>
</transition>
</template>
<script>
import Popper from 'element-ui/src/utils/vue-popper';
export default {
name: 'ElDropdownMenu',
componentName: 'ElDropdownMenu',
mixins: [Popper],
props: {
visibleArrow: {
type: Boolean,
default: true
},
arrowOffset: {
type: Number,
default: 0
}
},
data() {
return {
size: this.dropdown.dropdownSize
};
},
inject: ['dropdown'],
created() {
this.$on('updatePopper', () => {
if (this.showPopper) this.updatePopper();
});
this.$on('visible', val => {
this.showPopper = val;
});
},
mounted() {
this.dropdown.popperElm = this.popperElm = this.$el;
this.referenceElm = this.dropdown.$el;
// compatible with 2.6 new v-slot syntax
// issue link https://github.com/ElemeFE/element/issues/14345
this.dropdown.initDomOperation();
},
watch: {
'dropdown.placement': {
immediate: true,
handler(val) {
this.currentPlacement = val;
}
}
}
};
</script>