other / mew-iview

Commit d564f077d4e22213d997f0c09100b3bcc9d5e5f7

Authored by Aresn
Committed by GitHub
2 parents d45d2ee0 a3e1344d

Merge pull request #3255 from xiaofengsha/pr003 

Card组件增加title和icon属性，简化用户使用
Showing 1 changed file with 15 additions and 3 deletions   Show diff stats
Inline Side-by-side
src/components/card/card.vue
  Show/Hide comments   View file @d564f07
1 <template> 1 <template>
2 <div :class="classes"> 2 <div :class="classes">
3 - <div :class="headClasses" v-if="showHead"><slot name="title"></slot></div> 3 + <div :class="headClasses" v-if="showHead"><slot name="title">
  4 + <p v-if="title">
  5 + <Icon v-if="icon" :type="icon"></Icon>
  6 + {{title}}
  7 + </p>
  8 + </slot></div>
4 <div :class="extraClasses" v-if="showExtra"><slot name="extra"></slot></div> 9 <div :class="extraClasses" v-if="showExtra"><slot name="extra"></slot></div>
5 <div :class="bodyClasses" :style="bodyStyles"><slot></slot></div> 10 <div :class="bodyClasses" :style="bodyStyles"><slot></slot></div>
6 </div> 11 </div>
@@ -8,10 +13,11 @@ @@ -8,10 +13,11 @@
8 <script> 13 <script>
9 const prefixCls = 'ivu-card'; 14 const prefixCls = 'ivu-card';
10 const defaultPadding = 16; 15 const defaultPadding = 16;
  16 + import Icon from '../icon/icon.vue';
11 17
12 export default { 18 export default {
13 name: 'Card', 19 name: 'Card',
14 - 20 + components: { Icon },
15 props: { 21 props: {
16 bordered: { 22 bordered: {
17 type: Boolean, 23 type: Boolean,
@@ -28,6 +34,12 @@ @@ -28,6 +34,12 @@
28 padding: { 34 padding: {
29 type: Number, 35 type: Number,
30 default: defaultPadding 36 default: defaultPadding
  37 + },
  38 + title: {
  39 + type: String,
  40 + },
  41 + icon: {
  42 + type: String,
31 } 43 }
32 }, 44 },
33 data () { 45 data () {
@@ -67,7 +79,7 @@ @@ -67,7 +79,7 @@
67 } 79 }
68 }, 80 },
69 mounted () { 81 mounted () {
70 - this.showHead = this.$slots.title !== undefined; 82 + this.showHead = this.title || this.$slots.title !== undefined;
71 this.showExtra = this.$slots.extra !== undefined; 83 this.showExtra = this.$slots.extra !== undefined;
72 } 84 }
73 }; 85 };