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