add reusable progress-button cmoponent

This commit is contained in:
taehoon 2019-04-04 13:26:08 -04:00
parent fe7766bc61
commit 403c7bbe6c
1 changed files with 35 additions and 0 deletions

View File

@ -0,0 +1,35 @@
<template>
<button :disabled="progress || disabled" @click="onClick">
<template v-if="progress">
<slot name="progress" />
</template>
<template v-else>
<slot />
</template>
</button>
</template>
<script>
export default {
props: {
disabled: {
type: Boolean
},
click: {
type: Function,
default: () => Promise.resolve()
}
},
data () {
return {
progress: false
}
},
methods: {
onClick () {
this.progress = true
this.click().then(() => { this.progress = false })
}
}
}
</script>