Layout support reponsive
Layout support reponsive
This commit is contained in:
parent
43509ad876
commit
84a351dfdc
7 changed files with 380 additions and 285 deletions
|
@ -15,7 +15,11 @@
|
|||
offset: [Number, String],
|
||||
push: [Number, String],
|
||||
pull: [Number, String],
|
||||
className: String
|
||||
className: String,
|
||||
xs: [Number, Object],
|
||||
sm: [Number, Object],
|
||||
md: [Number, Object],
|
||||
lg: [Number, Object]
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
|
@ -24,7 +28,7 @@
|
|||
},
|
||||
computed: {
|
||||
classes () {
|
||||
return [
|
||||
let classList = [
|
||||
`${prefixCls}`,
|
||||
{
|
||||
[`${prefixCls}-span-${this.span}`]: this.span,
|
||||
|
@ -34,7 +38,24 @@
|
|||
[`${prefixCls}-pull-${this.pull}`]: this.pull,
|
||||
[`${this.className}`]: !!this.className
|
||||
}
|
||||
]
|
||||
];
|
||||
|
||||
['xs', 'sm', 'md', 'lg'].forEach(size => {
|
||||
if (typeof this[size] === 'number') {
|
||||
classList.push(`${prefixCls}-span-${size}-${this[size]}`);
|
||||
} else if (typeof this[size] === 'object') {
|
||||
let props = this[size];
|
||||
Object.keys(props).forEach(prop => {
|
||||
classList.push(
|
||||
prop !== 'span'
|
||||
? `${prefixCls}-${size}-${prop}-${props[prop]}`
|
||||
: `${prefixCls}-span-${size}-${props[prop]}`
|
||||
);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return classList;
|
||||
},
|
||||
styles () {
|
||||
let style = {};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue