other / mew-iview

Commit 6b71ba941828309b9cd64692bf64a70d45187e06

Authored by 梁灏
1 parent 5557dd66

update Dropdown 

update Dropdown
Showing 3 changed files with 63 additions and 11 deletions   Show diff stats
Inline Side-by-side
src/components/dropdown/dropdown-item.vue
  Show/Hide comments   View file @6b71ba9
... ... @@ -37,13 +37,15 @@
37 37 methods: {
38 38 handleClick () {
39 39 const $parent = this.$parent.$parent;
  40 + const hasChildren = this.$parent && this.$parent.$options.name === 'Dropdown';
40 41 if (this.disabled) {
41 42 this.$nextTick(() => {
42 43 $parent.visible = true;
43 44 });
  45 + } else if (hasChildren) {
  46 + this.$parent.$emit('on-haschild-click');
44 47 } else {
45   - if ($parent.trigger === 'hover') {
46   - $parent.visible = false;
  48 + if ($parent && $parent.$options.name === 'Dropdown') {
47 49 $parent.$emit('on-hover-click');
48 50 }
49 51 }
... ...
src/components/dropdown/dropdown.vue
  Show/Hide comments   View file @6b71ba9
... ... @@ -70,6 +70,14 @@
70 70 return false;
71 71 }
72 72 this.visible = false;
  73 + },
  74 + hasParent () {
  75 + const $parent = this.$parent.$parent;
  76 + if ($parent && $parent.$options.name === 'Dropdown') {
  77 + return $parent;
  78 + } else {
  79 + return false;
  80 + }
73 81 }
74 82 },
75 83 watch: {
... ... @@ -83,17 +91,22 @@
83 91 },
84 92 events: {
85 93 'on-click' (key) {
86   - const $parent = this.$parent.$parent;
87   - if ($parent && $parent.$options.name === 'Dropdown') {
88   - $parent.$emit('on-click', key);
89   - }
  94 + const $parent = this.hasParent();
  95 + if ($parent ) $parent.$emit('on-click', key)
90 96 },
91 97 'on-hover-click' () {
92   - const $parent = this.$parent.$parent;
93   - if ($parent && $parent.$options.name === 'Dropdown') {
94   - $parent.visible = false;
95   - $parent.$emit('on-hover-click');
96   - }
  98 + this.$nextTick(() => {
  99 + this.visible = false;
  100 + });
  101 + const $parent = this.hasParent();
  102 + if ($parent) $parent.$emit('on-hover-click');
  103 + },
  104 + 'on-haschild-click' () {
  105 + this.$nextTick(() => {
  106 + this.visible = true;
  107 + });
  108 + const $parent = this.hasParent();
  109 + if ($parent) $parent.$emit('on-haschild-click');
97 110 }
98 111 }
99 112 }
... ...
test/routers/dropdown.vue
  Show/Hide comments   View file @6b71ba9
1 1 <template>
2 2 <Dropdown trigger="hover" @on-click="click" style="margin-left: 20px">
3 3 <a href="javascript:void(0)">
  4 + hover 触发
  5 + <Icon type="arrow-down-b"></Icon>
  6 + </a>
  7 + <Dropdown-menu slot="list">
  8 + <Dropdown-item>驴打滚</Dropdown-item>
  9 + <Dropdown placement="right-start">
  10 + <Dropdown-item>
  11 + 炸酱面
  12 + <Icon type="arrow-right-b"></Icon>
  13 + </Dropdown-item>
  14 + <Dropdown-menu slot="list">
  15 + <Dropdown-item>驴打滚</Dropdown-item>
  16 + <Dropdown-item>炸酱面</Dropdown-item>
  17 + <Dropdown-item>豆汁儿</Dropdown-item>
  18 + <Dropdown placement="right-start">
  19 + <Dropdown-item>
  20 + 冰糖葫芦
  21 + <Icon type="arrow-right-b"></Icon>
  22 + </Dropdown-item>
  23 + <Dropdown-menu slot="list">
  24 + <Dropdown-item>驴打滚</Dropdown-item>
  25 + <Dropdown-item key="123">炸酱面</Dropdown-item>
  26 + <Dropdown-item>豆汁儿</Dropdown-item>
  27 + <Dropdown-item>冰糖葫芦</Dropdown-item>
  28 + <Dropdown-item>北京烤鸭</Dropdown-item>
  29 + </Dropdown-menu>
  30 + </Dropdown>
  31 + <Dropdown-item>北京烤鸭</Dropdown-item>
  32 + </Dropdown-menu>
  33 + </Dropdown>
  34 + <Dropdown-item>豆汁儿</Dropdown-item>
  35 + <Dropdown-item>冰糖葫芦</Dropdown-item>
  36 + <Dropdown-item>北京烤鸭</Dropdown-item>
  37 + </Dropdown-menu>
  38 + </Dropdown>
  39 + <Dropdown trigger="click" @on-click="click" style="margin-left: 20px">
  40 + <a href="javascript:void(0)">
4 41 click 触发
5 42 <Icon type="arrow-down-b"></Icon>
6 43 </a>
... ...