add Button UI
add Button UI
This commit is contained in:
parent
40f8606f58
commit
e1596b7e2c
9 changed files with 456 additions and 119 deletions
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<button :type="htmlType" :class="classes" :disabled="disabled">
|
||||
<Icon type="loading" v-if="loading"></Icon>
|
||||
<Icon :type="icon" v-if="icon && !loading"></Icon>
|
||||
<i :class="loadingIconClasses" v-if="loading"></i>
|
||||
<i :class="typeIconClasses" v-if="icon && !loading"></i>
|
||||
<slot></slot>
|
||||
</button>
|
||||
</template>
|
||||
|
@ -10,6 +10,7 @@
|
|||
import { oneOf } from '../../utils/assist';
|
||||
|
||||
const prefixCls = 'ivu-btn';
|
||||
const iconPrefixCls = 'ivu-icon';
|
||||
|
||||
export default {
|
||||
components: { Icon },
|
||||
|
@ -50,6 +51,17 @@
|
|||
[`${prefixCls}-loading`]: this.loading != null && this.loading
|
||||
}
|
||||
]
|
||||
},
|
||||
loadingIconClasses () {
|
||||
return `${iconPrefixCls} ivu-load-loop ${iconPrefixCls}-load-c`;
|
||||
},
|
||||
typeIconClasses () {
|
||||
return [
|
||||
`${iconPrefixCls}`,
|
||||
{
|
||||
[`${iconPrefixCls}-${this.icon}`]: !!this.icon
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue