Appearance
协同 xt-sale-collapse
常用方式
html
<template>
<view class="u-page__item">
<xt-sale-collapse :list="list" />
</view>
</template>
<script lang="ts" setup>
import type { CollapseList } from '@/components/xt-sale-collapse/type'
const list = ref<CollapseList[]>([])
onShow(() => {
setTimeout(() => {
list.value = [
{
preAmount: 300.0,
name: '活动价优惠',
cartList: [
{
name: 'E风 72 3匹 KFR-72LW/(72530)NhAa-3(WIFI)(含管) 顶(月影白)',
skuCode: 'KG211000100',
num: 1,
picture:
'https://markettest.gree.com/storage/group1/M00/00/E3/ZEdkPGMqe4GAPwrfAAA4rRYgK4c784.jpg',
preAmount: 300.0,
skuPrice: 6300.0
}
]
},
{
preAmount: 300.0,
name: '认筹券',
cartList: [
{
name: '冷静王 35 1.5匹 KFR-35GW/(35549)FNhCc-B1(WIFI)(含管) 顶(奢华金)',
skuCode: 'KB359009600',
num: 1,
picture:
'https://markettest.gree.com/storage/group1/M00/00/E3/ZEdkPGMqe4GAPwrfAAA4rRYgK4c784.jpg',
preAmount: 123.53,
skuPrice: 4200.0
},
{
name: 'T迪 72 3匹 KFR-72LW/(72569)Bb-2(含管) 顶(印花)',
skuCode: 'KG135002100',
num: 1,
picture:
'https://markettest.gree.com/storage/group1/M00/00/E3/ZEdkPGMqe4GAPwrfAAA4rRYgK4c784.jpg',
preAmount: 176.47,
skuPrice: 6000.0
}
]
}
]
}, 200)
})
</script>
<style lang="scss" scoped></style>
api
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
activeIndex | 激活展开折叠栏的index | Array[number] | [] (默认全部展开,不需要此参数可以不传) |
list | 明细数据 | Array[CollapseList] | [] |
CollapseList
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
name | 活动名称 | string | number | -- |
preAmount | 价格 | string | number | -- |
unit | 单位 | string | number | -¥ |
cartList | 折叠栏里面列表 | Array[CartList] | [] |
CartList
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
picture | 图片url | string | -- |
name | 名称 | string | -- |
preAmount | 共减价格 | number | string | -- |
skuPrice | 原价 | string | number | -- |
unit | 单位 | string | number | ¥ |