ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-19 18:14:13 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

add sku-header-price slot (#705)

Browse Source 
* [new feature] add sku-header-price slot
This commit is contained in:
wny
2018-03-16 22:03:42 +08:00
committed by GitHub
parent 4c195fd664
commit f9445ba4ee
5 changed files with 41 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
docs/demos/views/sku.vue
View File

@@ -59,6 +59,11 @@
@buy-clicked="onBuyClicked"
@add-cart="onAddCartClicked"
>
<template slot="sku-header-price" slot-scope="props">
<div class="van-sku__goods-price">
<span class="van-sku__price-symbol">￥</span><span class="van-sku__price-num">{{ props.price }}</span> only!!!
</div>
</template>
<template slot="sku-actions" slot-scope="props">
<div class="van-sku-actions">
<van-button bottom-action @click="onPointClicked">{{ $t('button1') }}</van-button>

7
docs/markdown/en-US/sku.md
View File

@@ -64,6 +64,12 @@ Vue.use(Sku);
@buy-clicked="onBuyClicked"
@add-cart="onAddCartClicked"
>
<!-- custom sku-header-price -->
<template slot="sku-header-price" slot-scope="props">
<div class="van-sku__goods-price">
<span class="van-sku__price-symbol">￥</span><span class="van-sku__price-num">{{ props.price }}</span> only!!!
</div>
</template>
<!-- custom sku actions -->
<template slot="sku-actions" slot-scope="props">
<div class="van-sku-actions">
@@ -114,6 +120,7 @@ Vue.use(Sku);
| Name | Description |
|-----------|-----------|
| sku-header | Custom header |
| sku-header-price | Custom header price area |
| sku-body-top | Custom content before sku-group |
| sku-group | Custom sku |
| extra-sku-group | Extra custom content |

7
docs/markdown/zh-CN/sku.md
View File

@@ -64,6 +64,12 @@ Vue.use(Sku);
@buy-clicked="onBuyClicked"
@add-cart="onAddCartClicked"
>
<!-- 自定义 sku-header-price -->
<template slot="sku-header-price" slot-scope="props">
<div class="van-sku__goods-price">
<span class="van-sku__price-symbol">￥</span><span class="van-sku__price-num">{{ props.price }}</span> only!!!
</div>
</template>
<!-- 自定义 sku actions -->
<template slot="sku-actions" slot-scope="props">
<div class="van-sku-actions">
@@ -116,6 +122,7 @@ Sku 组件默认划分好了若干区块，这些区块都定义成了 slot，
| 名称 | 说明 |
|-----------|-----------|
| sku-header | 商品信息展示区，包含商品图片、名称、价格等信息 |
| sku-header-price | 自定义sku头部价格展示 |
| sku-body-top | sku展示区上方的slot，无默认展示内容，按需使用 |
| sku-group | 商品sku展示区 |
| extra-sku-group | 额外商品sku展示区，一般用不到 |