mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-06 03:58:05 +08:00
test(Collapse): add demo test
This commit is contained in:
nemo-shen
neverland
parent
cecccc714b
commit
459bd1652f
@ -150,6 +150,7 @@
|
|||||||
"van-rate": "./dist/rate/index",
|
"van-rate": "./dist/rate/index",
|
||||||
"van-rate-demo": "./dist/rate/demo/index",
|
"van-rate-demo": "./dist/rate/demo/index",
|
||||||
"van-collapse": "./dist/collapse/index",
|
"van-collapse": "./dist/collapse/index",
|
||||||
|
"van-collapse-demo": "./dist/collapse/demo/index",
|
||||||
"van-collapse-item": "./dist/collapse-item/index",
|
"van-collapse-item": "./dist/collapse-item/index",
|
||||||
"van-picker": "./dist/picker/index",
|
"van-picker": "./dist/picker/index",
|
||||||
"van-overlay": "./dist/overlay/index",
|
"van-overlay": "./dist/overlay/index",
|
||||||
|
|||||||
@ -1,33 +1,3 @@
|
|||||||
import Page from '../../common/page';
|
import Page from '../../common/page';
|
||||||
import Toast from '../../dist/toast/toast';
|
|
||||||
|
|
||||||
Page({
|
Page();
|
||||||
data: {
|
|
||||||
active1: [0],
|
|
||||||
active2: 0,
|
|
||||||
active3: [],
|
|
||||||
active4: [],
|
|
||||||
title1: '有赞微商城',
|
|
||||||
title2: '有赞零售',
|
|
||||||
title3: '有赞美业',
|
|
||||||
content1: '提供多样店铺模板，快速搭建网上商城',
|
|
||||||
content2:
|
|
||||||
'网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失',
|
|
||||||
content3: '线上拓客，随时预约，贴心顺手的开单收银',
|
|
||||||
},
|
|
||||||
|
|
||||||
onChange(event) {
|
|
||||||
const { key } = event.currentTarget.dataset;
|
|
||||||
this.setData({
|
|
||||||
[key]: event.detail,
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
onOpen(event) {
|
|
||||||
Toast(`展开: ${event.detail}`);
|
|
||||||
},
|
|
||||||
|
|
||||||
onClose(event) {
|
|
||||||
Toast(`关闭: ${event.detail}`);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|||||||
@ -1,44 +1 @@
|
|||||||
<demo-block title="基础用法">
|
<van-collapse-demo />
|
||||||
<van-collapse value="{{ active1 }}" data-key="active1" bind:change="onChange">
|
|
||||||
<van-collapse-item title="{{ title1 }}">{{ content1 }}</van-collapse-item>
|
|
||||||
<van-collapse-item title="{{ title2 }}">{{ content2 }}</van-collapse-item>
|
|
||||||
<van-collapse-item title="{{ title3 }}" disabled>{{ content3 }}</van-collapse-item>
|
|
||||||
</van-collapse>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<demo-block title="手风琴">
|
|
||||||
<van-collapse value="{{ active2 }}" data-key="active2" accordion bind:change="onChange">
|
|
||||||
<van-collapse-item title="{{ title1 }}">{{ content1 }}</van-collapse-item>
|
|
||||||
<van-collapse-item title="{{ title2 }}">{{ content2 }}</van-collapse-item>
|
|
||||||
<van-collapse-item title="{{ title3 }}">{{ content3 }}</van-collapse-item>
|
|
||||||
</van-collapse>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<demo-block title="事件监听">
|
|
||||||
<van-collapse value="{{ active3 }}" data-key="active3" bind:change="onChange" bind:open="onOpen" bind:close="onClose">
|
|
||||||
<van-collapse-item title="{{ title1 }}">{{ content1 }}</van-collapse-item>
|
|
||||||
<van-collapse-item title="{{ title2 }}">{{ content2 }}</van-collapse-item>
|
|
||||||
<van-collapse-item title="{{ title3 }}">{{ content3 }}</van-collapse-item>
|
|
||||||
</van-collapse>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<demo-block title="自定义标题内容">
|
|
||||||
<van-collapse value="{{ active4 }}" data-key="active4" bind:change="onChange">
|
|
||||||
<van-collapse-item>
|
|
||||||
<view slot="title">
|
|
||||||
{{ title1 }}
|
|
||||||
<van-icon name="question-o" custom-class="van-icon-question" />
|
|
||||||
</view>
|
|
||||||
{{ content1 }}
|
|
||||||
</van-collapse-item>
|
|
||||||
<van-collapse-item
|
|
||||||
title="{{ title2 }}"
|
|
||||||
value="内容"
|
|
||||||
icon="shop-o"
|
|
||||||
>
|
|
||||||
{{ content2 }}
|
|
||||||
</van-collapse-item>
|
|
||||||
</van-collapse>
|
|
||||||
</demo-block>
|
|
||||||
|
|
||||||
<van-toast id="van-toast" />
|
|
||||||
|
|||||||
9
packages/collapse/demo/index.json
Normal file
9
packages/collapse/demo/index.json
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
{
|
||||||
|
"component": true,
|
||||||
|
"usingComponents": {
|
||||||
|
"van-collapse": "../../collapse/index",
|
||||||
|
"van-collapse-item": "../../collapse-item/index",
|
||||||
|
"van-toast": "../../toast/index",
|
||||||
|
"demo-block": "../../../example/components/demo-block/index"
|
||||||
|
}
|
||||||
|
}
|
||||||
41
packages/collapse/demo/index.ts
Normal file
41
packages/collapse/demo/index.ts
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
import { VantComponent } from '../../common/component';
|
||||||
|
import Toast from '../../toast/toast';
|
||||||
|
|
||||||
|
VantComponent({
|
||||||
|
data: {
|
||||||
|
active1: [0],
|
||||||
|
active2: 0,
|
||||||
|
active3: [],
|
||||||
|
active4: [],
|
||||||
|
title1: '有赞微商城',
|
||||||
|
title2: '有赞零售',
|
||||||
|
title3: '有赞美业',
|
||||||
|
content1: '提供多样店铺模板，快速搭建网上商城',
|
||||||
|
content2:
|
||||||
|
'网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失',
|
||||||
|
content3: '线上拓客，随时预约，贴心顺手的开单收银',
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
onChange(event) {
|
||||||
|
const { key } = event.currentTarget.dataset;
|
||||||
|
this.setData({
|
||||||
|
[key]: event.detail,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onOpen(event) {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
message: `展开: ${event.detail}`,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onClose(event) {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
message: `关闭: ${event.detail}`,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
44
packages/collapse/demo/index.wxml
Normal file
44
packages/collapse/demo/index.wxml
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
<demo-block title="基础用法">
|
||||||
|
<van-collapse value="{{ active1 }}" data-key="active1" bind:change="onChange">
|
||||||
|
<van-collapse-item title="{{ title1 }}">{{ content1 }}</van-collapse-item>
|
||||||
|
<van-collapse-item title="{{ title2 }}">{{ content2 }}</van-collapse-item>
|
||||||
|
<van-collapse-item title="{{ title3 }}" disabled>{{ content3 }}</van-collapse-item>
|
||||||
|
</van-collapse>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block title="手风琴">
|
||||||
|
<van-collapse value="{{ active2 }}" data-key="active2" accordion bind:change="onChange">
|
||||||
|
<van-collapse-item title="{{ title1 }}">{{ content1 }}</van-collapse-item>
|
||||||
|
<van-collapse-item title="{{ title2 }}">{{ content2 }}</van-collapse-item>
|
||||||
|
<van-collapse-item title="{{ title3 }}">{{ content3 }}</van-collapse-item>
|
||||||
|
</van-collapse>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block title="事件监听">
|
||||||
|
<van-collapse value="{{ active3 }}" data-key="active3" bind:change="onChange" bind:open="onOpen" bind:close="onClose">
|
||||||
|
<van-collapse-item title="{{ title1 }}">{{ content1 }}</van-collapse-item>
|
||||||
|
<van-collapse-item title="{{ title2 }}">{{ content2 }}</van-collapse-item>
|
||||||
|
<van-collapse-item title="{{ title3 }}">{{ content3 }}</van-collapse-item>
|
||||||
|
</van-collapse>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block title="自定义标题内容">
|
||||||
|
<van-collapse value="{{ active4 }}" data-key="active4" bind:change="onChange">
|
||||||
|
<van-collapse-item>
|
||||||
|
<view slot="title">
|
||||||
|
{{ title1 }}
|
||||||
|
<van-icon name="question-o" custom-class="van-icon-question" />
|
||||||
|
</view>
|
||||||
|
{{ content1 }}
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item
|
||||||
|
title="{{ title2 }}"
|
||||||
|
value="内容"
|
||||||
|
icon="shop-o"
|
||||||
|
>
|
||||||
|
{{ content2 }}
|
||||||
|
</van-collapse-item>
|
||||||
|
</van-collapse>
|
||||||
|
</demo-block>
|
||||||
|
|
||||||
|
<van-toast id="van-toast" />
|
||||||
704
packages/collapse/test/__snapshots__/demo.spec.ts.snap
Normal file
704
packages/collapse/test/__snapshots__/demo.spec.ts.snap
Normal file
@ -0,0 +1,704 @@
|
|||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`should render demo and match snapshot 1`] = `
|
||||||
|
<main>
|
||||||
|
<demo-block>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class demo-block van-clearfix "
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="demo-block__title"
|
||||||
|
>
|
||||||
|
基础用法
|
||||||
|
</wx-view>
|
||||||
|
<van-collapse
|
||||||
|
data-key="active1"
|
||||||
|
bind:change="onChange"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-collapse van-hairline--top-bottom"
|
||||||
|
>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class "
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title van-collapse-item__title--expanded"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞微商城
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
提供多样店铺模板，快速搭建网上商城
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞零售
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title van-collapse-item__title--disabled"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞美业
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
线上拓客，随时预约，贴心顺手的开单收银
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse>
|
||||||
|
</wx-view>
|
||||||
|
</demo-block>
|
||||||
|
<demo-block>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class demo-block van-clearfix "
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="demo-block__title"
|
||||||
|
>
|
||||||
|
手风琴
|
||||||
|
</wx-view>
|
||||||
|
<van-collapse
|
||||||
|
data-key="active2"
|
||||||
|
bind:change="onChange"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-collapse van-hairline--top-bottom"
|
||||||
|
>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class "
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title van-collapse-item__title--expanded"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞微商城
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
提供多样店铺模板，快速搭建网上商城
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞零售
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞美业
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
线上拓客，随时预约，贴心顺手的开单收银
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse>
|
||||||
|
</wx-view>
|
||||||
|
</demo-block>
|
||||||
|
<demo-block>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class demo-block van-clearfix "
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="demo-block__title"
|
||||||
|
>
|
||||||
|
事件监听
|
||||||
|
</wx-view>
|
||||||
|
<van-collapse
|
||||||
|
data-key="active3"
|
||||||
|
bind:change="onChange"
|
||||||
|
bind:close="onClose"
|
||||||
|
bind:open="onOpen"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-collapse van-hairline--top-bottom"
|
||||||
|
>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class "
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞微商城
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
提供多样店铺模板，快速搭建网上商城
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞零售
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞美业
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
线上拓客，随时预约，贴心顺手的开单收银
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse>
|
||||||
|
</wx-view>
|
||||||
|
</demo-block>
|
||||||
|
<demo-block>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class demo-block van-clearfix "
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="demo-block__title"
|
||||||
|
>
|
||||||
|
自定义标题内容
|
||||||
|
</wx-view>
|
||||||
|
<van-collapse
|
||||||
|
data-key="active4"
|
||||||
|
bind:change="onChange"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-collapse van-hairline--top-bottom"
|
||||||
|
>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class "
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
slot="title"
|
||||||
|
>
|
||||||
|
|
||||||
|
有赞微商城
|
||||||
|
|
||||||
|
<van-icon
|
||||||
|
customClass="van-icon-question"
|
||||||
|
name="question-o"
|
||||||
|
/>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
/>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
|
||||||
|
提供多样店铺模板，快速搭建网上商城
|
||||||
|
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
<van-collapse-item>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item custom-class van-hairline--top"
|
||||||
|
>
|
||||||
|
<van-cell
|
||||||
|
class="van-collapse-item__title"
|
||||||
|
customClass="van-cell"
|
||||||
|
hoverClass="van-cell--hover"
|
||||||
|
rightIconClass="van-cell__right-icon"
|
||||||
|
titleClass="title-class"
|
||||||
|
bind:click="onClick"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-cell van-cell--borderless van-cell--clickable"
|
||||||
|
hoverClass="van-cell--hover hover-class"
|
||||||
|
hoverStayTime="70"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__left-icon-wrap"
|
||||||
|
customClass="van-cell__left-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-shop-o"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__title title-class"
|
||||||
|
style=""
|
||||||
|
>
|
||||||
|
有赞零售
|
||||||
|
</wx-view>
|
||||||
|
<wx-view
|
||||||
|
class="van-cell__value value-class"
|
||||||
|
>
|
||||||
|
内容
|
||||||
|
</wx-view>
|
||||||
|
<van-icon
|
||||||
|
class="van-cell__right-icon-wrap right-icon-class"
|
||||||
|
customClass="van-cell__right-icon"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="custom-class van-icon van-icon-arrow"
|
||||||
|
style=""
|
||||||
|
bind:tap="onClick"
|
||||||
|
/>
|
||||||
|
</van-icon>
|
||||||
|
</wx-view>
|
||||||
|
</van-cell>
|
||||||
|
<wx-view
|
||||||
|
animation=""
|
||||||
|
class="van-collapse-item__wrapper"
|
||||||
|
style="height: 0;"
|
||||||
|
>
|
||||||
|
<wx-view
|
||||||
|
class="van-collapse-item__content content-class"
|
||||||
|
>
|
||||||
|
|
||||||
|
网店吸粉获客、会员分层营销、一机多种收款，告别经营低效和客户流失
|
||||||
|
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse-item>
|
||||||
|
</wx-view>
|
||||||
|
</van-collapse>
|
||||||
|
</wx-view>
|
||||||
|
</demo-block>
|
||||||
|
<van-toast
|
||||||
|
id="van-toast"
|
||||||
|
>
|
||||||
|
<van-transition
|
||||||
|
customClass="van-toast__container"
|
||||||
|
/>
|
||||||
|
</van-toast>
|
||||||
|
</main>
|
||||||
|
`;
|
||||||
11
packages/collapse/test/demo.spec.ts
Normal file
11
packages/collapse/test/demo.spec.ts
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import path from 'path';
|
||||||
|
import simulate from 'miniprogram-simulate';
|
||||||
|
|
||||||
|
test('should render demo and match snapshot', () => {
|
||||||
|
const id = simulate.load(path.resolve(__dirname, '../demo/index'), {
|
||||||
|
rootPath: path.resolve(__dirname, '../../'),
|
||||||
|
});
|
||||||
|
const comp = simulate.render(id);
|
||||||
|
comp.attach(document.createElement('parent-wrapper'));
|
||||||
|
expect(comp.toJSON()).toMatchSnapshot();
|
||||||
|
});
|
||||||
Loading…
x
Reference in New Issue
Block a user