diff --git a/example/app.json b/example/app.json
index b8d2f2fd..5570a108 100644
--- a/example/app.json
+++ b/example/app.json
@@ -116,6 +116,7 @@
"van-steps": "./dist/steps/index",
"van-steps-demo": "./dist/steps/demo/index",
"van-sticky": "./dist/sticky/index",
+ "van-sticky-demo": "./dist/sticky/demo/index",
"van-submit-bar": "./dist/submit-bar/index",
"van-swipe-cell": "./dist/swipe-cell/index",
"van-uploader": "./dist/uploader/index",
diff --git a/example/pages/sticky/index.js b/example/pages/sticky/index.js
index 07c72027..cc11dfda 100644
--- a/example/pages/sticky/index.js
+++ b/example/pages/sticky/index.js
@@ -1,27 +1,3 @@
import Page from '../../common/page';
-Page({
- data: {
- container: null,
- scrollTop: 0,
- offsetTop: 0,
- },
-
- onReady() {
- this.setData({
- container: () => wx.createSelectorQuery().select('#container'),
- });
- },
-
- onScroll(event) {
- wx.createSelectorQuery()
- .select('#scroller')
- .boundingClientRect((res) => {
- this.setData({
- scrollTop: event.detail.scrollTop,
- offsetTop: res.top,
- });
- })
- .exec();
- },
-});
+Page();
diff --git a/example/pages/sticky/index.wxml b/example/pages/sticky/index.wxml
index f8bf6599..f98ee221 100644
--- a/example/pages/sticky/index.wxml
+++ b/example/pages/sticky/index.wxml
@@ -1,42 +1 @@
-
-
-
- 基础用法
-
-
-
-
-
-
-
- 吸顶距离
-
-
-
-
-
-
-
-
- 指定容器
-
-
-
-
-
-
-
-
-
-
- 嵌套在 scroll-view 内
-
-
-
-
-
+
diff --git a/example/pages/sticky/index.wxss b/example/pages/sticky/index.wxss
index f88f1fa4..96ac78d1 100644
--- a/example/pages/sticky/index.wxss
+++ b/example/pages/sticky/index.wxss
@@ -1,14 +1,3 @@
page {
height: 200vh;
}
-
-.van-button {
- margin-left: 16px;
-}
-
-.sticky-container {
- position: relative;
- z-index: -1;
- height: 150px;
- background-color: #fff;
-}
diff --git a/packages/sticky/demo/index.json b/packages/sticky/demo/index.json
new file mode 100644
index 00000000..af698fa6
--- /dev/null
+++ b/packages/sticky/demo/index.json
@@ -0,0 +1,8 @@
+{
+ "component": true,
+ "usingComponents": {
+ "van-sticky": "../../sticky/index",
+ "van-button": "../../button/index",
+ "demo-block": "../../../example/components/demo-block/index"
+ }
+}
diff --git a/packages/sticky/demo/index.less b/packages/sticky/demo/index.less
new file mode 100644
index 00000000..11540523
--- /dev/null
+++ b/packages/sticky/demo/index.less
@@ -0,0 +1,10 @@
+.van-button {
+ margin-left: 16px;
+}
+
+.sticky-container {
+ position: relative;
+ z-index: -1;
+ height: 150px;
+ background-color: #fff;
+}
diff --git a/packages/sticky/demo/index.ts b/packages/sticky/demo/index.ts
new file mode 100644
index 00000000..f49c26e3
--- /dev/null
+++ b/packages/sticky/demo/index.ts
@@ -0,0 +1,29 @@
+import { VantComponent } from '../../common/component';
+
+VantComponent({
+ data: {
+ container: () => {},
+ scrollTop: 0,
+ offsetTop: 0,
+ },
+
+ mounted() {
+ this.setData({
+ container: () => this.createSelectorQuery().select('#container'),
+ });
+ },
+
+ methods: {
+ onScroll(event) {
+ this.createSelectorQuery()
+ .select('#scroller')
+ .boundingClientRect((res) => {
+ this.setData({
+ scrollTop: event.detail.scrollTop,
+ offsetTop: res.top,
+ });
+ })
+ .exec();
+ },
+ },
+});
diff --git a/packages/sticky/demo/index.wxml b/packages/sticky/demo/index.wxml
new file mode 100644
index 00000000..f8bf6599
--- /dev/null
+++ b/packages/sticky/demo/index.wxml
@@ -0,0 +1,42 @@
+
+
+
+ 基础用法
+
+
+
+
+
+
+
+ 吸顶距离
+
+
+
+
+
+
+
+
+ 指定容器
+
+
+
+
+
+
+
+
+
+
+ 嵌套在 scroll-view 内
+
+
+
+
+
diff --git a/packages/sticky/test/__snapshots__/demo.spec.ts.snap b/packages/sticky/test/__snapshots__/demo.spec.ts.snap
new file mode 100644
index 00000000..113a24a6
--- /dev/null
+++ b/packages/sticky/test/__snapshots__/demo.spec.ts.snap
@@ -0,0 +1,254 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render demo and match snapshot 1`] = `
+
+
+
+
+ 基础用法
+
+
+
+
+
+
+
+
+ 基础用法
+
+
+
+
+
+
+
+
+
+
+
+
+ 吸顶距离
+
+
+
+
+
+
+
+
+ 吸顶距离
+
+
+
+
+
+
+
+
+
+
+
+
+ 指定容器
+
+
+
+
+
+
+
+
+
+ 指定容器
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 嵌套在 scroll-view 内使用
+
+
+
+
+
+
+
+
+
+
+ 嵌套在 scroll-view 内
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/packages/sticky/test/demo.spec.ts b/packages/sticky/test/demo.spec.ts
new file mode 100644
index 00000000..4c3798cb
--- /dev/null
+++ b/packages/sticky/test/demo.spec.ts
@@ -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();
+});