Commit f9a6a467a60a4f28b0ba34a778c687b605d3b8eb
1 parent
e7fc76d8
update Button
Showing
2 changed files
with
17 additions
and
10 deletions
Show diff stats
src/components/button/button.vue
| @@ -5,7 +5,9 @@ | @@ -5,7 +5,9 @@ | ||
| 5 | :disabled="disabled" | 5 | :disabled="disabled" |
| 6 | :href="linkUrl" | 6 | :href="linkUrl" |
| 7 | :target="target" | 7 | :target="target" |
| 8 | - @click="handleClickLink"> | 8 | + @click.exact="handleClickLink($event, false)" |
| 9 | + @click.ctrl="handleClickLink($event, true)" | ||
| 10 | + @click.meta="handleClickLink($event, true)"> | ||
| 9 | <Icon class="ivu-load-loop" type="ios-loading" v-if="loading"></Icon> | 11 | <Icon class="ivu-load-loop" type="ios-loading" v-if="loading"></Icon> |
| 10 | <Icon :type="icon" :custom="customIcon" v-if="(icon || customIcon) && !loading"></Icon> | 12 | <Icon :type="icon" :custom="customIcon" v-if="(icon || customIcon) && !loading"></Icon> |
| 11 | <span v-if="showSlot" ref="slot"><slot></slot></span> | 13 | <span v-if="showSlot" ref="slot"><slot></slot></span> |
| @@ -99,10 +101,11 @@ | @@ -99,10 +101,11 @@ | ||
| 99 | } | 101 | } |
| 100 | }, | 102 | }, |
| 101 | methods: { | 103 | methods: { |
| 102 | - handleClickLink (event) { | 104 | + // Ctrl or CMD and click, open in new window when use `to` |
| 105 | + handleClickLink (event, new_window) { | ||
| 103 | this.$emit('click', event); | 106 | this.$emit('click', event); |
| 104 | 107 | ||
| 105 | - this.handleCheckClick(event); | 108 | + this.handleCheckClick(event, new_window); |
| 106 | } | 109 | } |
| 107 | }, | 110 | }, |
| 108 | mounted () { | 111 | mounted () { |
src/mixins/link.js
| @@ -24,21 +24,25 @@ export default { | @@ -24,21 +24,25 @@ export default { | ||
| 24 | } | 24 | } |
| 25 | }, | 25 | }, |
| 26 | methods: { | 26 | methods: { |
| 27 | - handleClick () { | ||
| 28 | - const isRoute = this.$router; | ||
| 29 | - if (isRoute) { | ||
| 30 | - this.replace ? this.$router.replace(this.to) : this.$router.push(this.to); | 27 | + handleClick (new_window = false) { |
| 28 | + if (new_window){ | ||
| 29 | + window.open(this.to); | ||
| 31 | } else { | 30 | } else { |
| 32 | - window.location.href = this.to; | 31 | + const isRoute = this.$router; |
| 32 | + if (isRoute) { | ||
| 33 | + this.replace ? this.$router.replace(this.to) : this.$router.push(this.to); | ||
| 34 | + } else { | ||
| 35 | + window.location.href = this.to; | ||
| 36 | + } | ||
| 33 | } | 37 | } |
| 34 | }, | 38 | }, |
| 35 | - handleCheckClick (event) { | 39 | + handleCheckClick (event, new_window = false) { |
| 36 | if (this.to) { | 40 | if (this.to) { |
| 37 | if (this.target === '_blank') { | 41 | if (this.target === '_blank') { |
| 38 | return false; | 42 | return false; |
| 39 | } else { | 43 | } else { |
| 40 | event.preventDefault(); | 44 | event.preventDefault(); |
| 41 | - this.handleClick(); | 45 | + this.handleClick(new_window); |
| 42 | } | 46 | } |
| 43 | } | 47 | } |
| 44 | } | 48 | } |