Button add new prop 'long'

Button add new prop 'long'
This commit is contained in:
梁灏 2016-11-21 10:00:52 +08:00
parent b88f42eb62
commit 71d9fc8e45
3 changed files with 16 additions and 2 deletions

View file

@ -38,7 +38,11 @@
return oneOf(value, ['button', 'submit', 'reset']); return oneOf(value, ['button', 'submit', 'reset']);
} }
}, },
icon: String icon: String,
long: {
type: Boolean,
default: false
}
}, },
data () { data () {
return { return {
@ -51,6 +55,7 @@
`${prefixCls}`, `${prefixCls}`,
{ {
[`${prefixCls}-${this.type}`]: !!this.type, [`${prefixCls}-${this.type}`]: !!this.type,
[`${prefixCls}-long`]: this.long,
[`${prefixCls}-${this.shape}`]: !!this.shape, [`${prefixCls}-${this.shape}`]: !!this.shape,
[`${prefixCls}-${this.size}`]: !!this.size, [`${prefixCls}-${this.size}`]: !!this.size,
[`${prefixCls}-loading`]: this.loading != null && this.loading, [`${prefixCls}-loading`]: this.loading != null && this.loading,
@ -70,7 +75,7 @@
] ]
} }
}, },
ready () { compiled () {
this.showSlot = this.$els.slot.innerHTML.replace(/\n/g, '').replace(/<!--[\w\W\r\n]*?-->/gmi, '') !== ''; this.showSlot = this.$els.slot.innerHTML.replace(/\n/g, '').replace(/<!--[\w\W\r\n]*?-->/gmi, '') !== '';
} }
} }

View file

@ -4,6 +4,10 @@
.btn; .btn;
.btn-default; .btn-default;
&-long{
width: 100%;
}
& > .ivu-icon + span, & > span + .ivu-icon{ & > .ivu-icon + span, & > span + .ivu-icon{
margin-left: 4px; margin-left: 4px;
} }

View file

@ -5,6 +5,11 @@
<i-button type="warning">按钮</i-button> <i-button type="warning">按钮</i-button>
<i-button type="error">按钮</i-button> <i-button type="error">按钮</i-button>
<i-button type="info">按钮</i-button> <i-button type="info">按钮</i-button>
<i-button icon="ios-search" type="success"></i-button>
<br><br>
<div style="width:400px;height:200px;">
<i-button type="error" long size="small">按钮</i-button>
</div>
<br><br> <br><br>
<Button-group> <Button-group>
<i-button>取消</i-button> <i-button>取消</i-button>