Collapse add simple prop
This commit is contained in:
parent
0c9f8fabb3
commit
3f611f57ed
4 changed files with 25 additions and 4 deletions
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<Collapse accordion v-model="value3">
|
<Collapse accordion v-model="value3" simple>
|
||||||
<Panel name="1" hide-arrow>
|
<Panel name="1" hide-arrow>
|
||||||
史蒂夫·乔布斯
|
史蒂夫·乔布斯
|
||||||
<div slot="content">
|
<div slot="content">
|
||||||
|
@ -29,7 +29,7 @@
|
||||||
|
|
||||||
<br/>
|
<br/>
|
||||||
<br/>
|
<br/>
|
||||||
<Collapse v-model="value5">
|
<Collapse v-model="value5" simple>
|
||||||
<Panel name="21">
|
<Panel name="21">
|
||||||
斯蒂夫·盖瑞·沃兹尼亚克
|
斯蒂夫·盖瑞·沃兹尼亚克
|
||||||
<p slot="content">斯蒂夫·盖瑞·沃兹尼亚克(Stephen Gary Wozniak),美国电脑工程师,曾与史蒂夫·乔布斯合伙创立苹果电脑(今之苹果公司)。斯蒂夫·盖瑞·沃兹尼亚克曾就读于美国科罗拉多大学,后转学入美国著名高等学府加州大学伯克利分校(UC Berkeley)并获得电机工程及计算机(EECS)本科学位(1987年)。</p>
|
<p slot="content">斯蒂夫·盖瑞·沃兹尼亚克(Stephen Gary Wozniak),美国电脑工程师,曾与史蒂夫·乔布斯合伙创立苹果电脑(今之苹果公司)。斯蒂夫·盖瑞·沃兹尼亚克曾就读于美国科罗拉多大学,后转学入美国著名高等学府加州大学伯克利分校(UC Berkeley)并获得电机工程及计算机(EECS)本科学位(1987年)。</p>
|
||||||
|
|
|
@ -15,6 +15,10 @@
|
||||||
},
|
},
|
||||||
value: {
|
value: {
|
||||||
type: [Array, String]
|
type: [Array, String]
|
||||||
|
},
|
||||||
|
simple: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
|
@ -24,7 +28,12 @@
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
classes () {
|
classes () {
|
||||||
return `${prefixCls}`;
|
return [
|
||||||
|
`${prefixCls}`,
|
||||||
|
{
|
||||||
|
[`${prefixCls}-simple`]: this.simple
|
||||||
|
}
|
||||||
|
];
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
|
|
|
@ -99,7 +99,7 @@
|
||||||
},
|
},
|
||||||
iconClasses () {
|
iconClasses () {
|
||||||
return [
|
return [
|
||||||
`ivu-icon`,
|
'ivu-icon',
|
||||||
{
|
{
|
||||||
[`ivu-icon-${this.icon}`]: this.icon !== '',
|
[`ivu-icon-${this.icon}`]: this.icon !== '',
|
||||||
[`${this.customIcon}`]: this.customIcon !== '',
|
[`${this.customIcon}`]: this.customIcon !== '',
|
||||||
|
|
|
@ -5,6 +5,12 @@
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid @border-color-base;
|
border: 1px solid @border-color-base;
|
||||||
|
|
||||||
|
&-simple{
|
||||||
|
border-left: none;
|
||||||
|
border-right: none;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
& > &-item{
|
& > &-item{
|
||||||
border-top: 1px solid @border-color-base;
|
border-top: 1px solid @border-color-base;
|
||||||
&:first-child {
|
&:first-child {
|
||||||
|
@ -30,6 +36,9 @@
|
||||||
& > &-item&-item-active > &-header{
|
& > &-item&-item-active > &-header{
|
||||||
border-bottom: 1px solid @border-color-base;
|
border-bottom: 1px solid @border-color-base;
|
||||||
}
|
}
|
||||||
|
&-simple > &-item&-item-active > &-header{
|
||||||
|
border-bottom: 1px solid transparent;
|
||||||
|
}
|
||||||
& > &-item&-item-active > &-header > i{
|
& > &-item&-item-active > &-header > i{
|
||||||
transform: rotate(90deg);
|
transform: rotate(90deg);
|
||||||
}
|
}
|
||||||
|
@ -46,6 +55,9 @@
|
||||||
padding-bottom: 16px;
|
padding-bottom: 16px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&-simple > &-item > &-content > &-content-box{
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
&-item-active > &-content{
|
&-item-active > &-content{
|
||||||
//display: block;
|
//display: block;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue