mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-05-22 06:31:46 +08:00
[Improvement] Card: update slot usage
This commit is contained in:
parent
92a98d2322
commit
f17a09419f
@ -53,20 +53,16 @@
|
||||
| price | 商品价格 | `String | Number` | - |
|
||||
| centered | 内容是否垂直居中 | `String` | `false` |
|
||||
| currency | 货币符号 | `String` | `¥` |
|
||||
| use-desc-slot | 是否使用 desc slot | `Boolean` | `false` |
|
||||
| use-title-slot | 是否使用 title slot | `Boolean` | `false` |
|
||||
| use-thumb-slot | 是否使用 thumb slot | `Boolean` | `false` |
|
||||
| use-footer-slot | 是否使用 footer slot | `Boolean` | `false` |
|
||||
|
||||
### Slot
|
||||
|
||||
| 名称 | 说明 |
|
||||
|-----------|-----------|
|
||||
| title | 自定义标题 |
|
||||
| desc | 自定义描述 |
|
||||
| tags | 自定义 tags |
|
||||
| thumb | 自定义 thumb |
|
||||
| title | 自定义标题栏,如果设置了`title`或`price`属性,则不生效 |
|
||||
| desc | 自定义描述栏,如果设置了`desc`或`num`属性,则不生效 |
|
||||
| thumb | 自定义 thumb,如果设置了`thumb`属性,则不生效 |
|
||||
| footer | 自定义 footer |
|
||||
| tags | 自定义 tags |
|
||||
|
||||
### 外部样式类
|
||||
|
||||
|
@ -22,10 +22,6 @@ Component({
|
||||
currency: {
|
||||
type: String,
|
||||
default: '¥'
|
||||
},
|
||||
useDescSlot: Boolean,
|
||||
useTitleSlot: Boolean,
|
||||
useThumbSlot: Boolean,
|
||||
useFooterSlot: Boolean
|
||||
}
|
||||
}
|
||||
});
|
||||
|
@ -1,22 +1,22 @@
|
||||
<view class="custom-class van-card">
|
||||
<view class="van-card__thumb">
|
||||
<slot wx:if="{{ useThumbSlot }}" name="thumb" />
|
||||
<image wx:else src="{{ thumb }}" class="van-card__img thumb-class" />
|
||||
<image wx:if="{{ thumb }}" src="{{ thumb }}" class="van-card__img thumb-class" />
|
||||
<slot wx:else name="thumb" />
|
||||
</view>
|
||||
<view class="van-card__content">
|
||||
<slot wx:if="{{ useTitleSlot }}" name="title" />
|
||||
<view wx:elseif="{{ title || price }}" class="van-card__row">
|
||||
<view wx:if="{{ title || price }}" class="van-card__row">
|
||||
<view wx:if="{{ title }}" class="van-card__title title-class">{{ title }}</view>
|
||||
<view wx:if="{{ price }}" class="van-card__price price-class">{{ currency }} {{ price }}</view>
|
||||
</view>
|
||||
<slot wx:if="{{ useDescSlot }}" name="desc" />
|
||||
<view wx:elseif="{{ desc || num }}" class="van-card__row">
|
||||
<slot wx:else name="title" />
|
||||
<view wx:if="{{ desc || num }}" class="van-card__row">
|
||||
<view wx:if="{{ desc }}" class="van-card__desc desc-class">{{ desc }}</view>
|
||||
<view wx:if="{{ num }}" class="van-card__num num-class">x {{ num }}</view>
|
||||
</view>
|
||||
<slot wx:else name="desc" />
|
||||
<slot name="tags" />
|
||||
</view>
|
||||
<view class="van-card__footer" wx:if="{{ useFooterSlot }}">
|
||||
<view class="van-card__footer">
|
||||
<slot name="footer" />
|
||||
</view>
|
||||
</view>
|
||||
|
Loading…
x
Reference in New Issue
Block a user