diff --git a/example/app.json b/example/app.json
index e5e5e403..49367492 100644
--- a/example/app.json
+++ b/example/app.json
@@ -98,6 +98,7 @@
"van-loading": "./dist/loading/index",
"van-loading-demo": "./dist/loading/demo/index",
"van-nav-bar": "./dist/nav-bar/index",
+ "van-nav-bar-demo": "./dist/nav-bar/demo/index",
"van-notice-bar": "./dist/notice-bar/index",
"van-notice-bar-demo": "./dist/notice-bar/demo/index",
"van-notify": "./dist/notify/index",
diff --git a/example/pages/nav-bar/index.js b/example/pages/nav-bar/index.js
index 971c4793..cc11dfda 100644
--- a/example/pages/nav-bar/index.js
+++ b/example/pages/nav-bar/index.js
@@ -1,11 +1,3 @@
import Page from '../../common/page';
-Page({
- onClickLeft() {
- wx.showToast({ title: '点击返回', icon: 'none' });
- },
-
- onClickRight() {
- wx.showToast({ title: '点击按钮', icon: 'none' });
- }
-});
+Page();
diff --git a/example/pages/nav-bar/index.wxml b/example/pages/nav-bar/index.wxml
index b61ba556..024f956e 100644
--- a/example/pages/nav-bar/index.wxml
+++ b/example/pages/nav-bar/index.wxml
@@ -1,15 +1 @@
-
-
-
-
-
-
-
-
-
+
diff --git a/packages/nav-bar/demo/index.json b/packages/nav-bar/demo/index.json
new file mode 100644
index 00000000..07a793c0
--- /dev/null
+++ b/packages/nav-bar/demo/index.json
@@ -0,0 +1,8 @@
+{
+ "component": true,
+ "usingComponents": {
+ "van-icon": "../../icon/index",
+ "van-nav-bar": "../../nav-bar/index",
+ "demo-block": "../../../example/components/demo-block/index"
+ }
+}
diff --git a/example/pages/nav-bar/index.wxss b/packages/nav-bar/demo/index.less
similarity index 100%
rename from example/pages/nav-bar/index.wxss
rename to packages/nav-bar/demo/index.less
diff --git a/packages/nav-bar/demo/index.ts b/packages/nav-bar/demo/index.ts
new file mode 100644
index 00000000..d67178ba
--- /dev/null
+++ b/packages/nav-bar/demo/index.ts
@@ -0,0 +1,13 @@
+import { VantComponent } from '../../common/component';
+
+VantComponent({
+ methods: {
+ onClickLeft() {
+ wx.showToast({ title: '点击返回', icon: 'none' });
+ },
+
+ onClickRight() {
+ wx.showToast({ title: '点击按钮', icon: 'none' });
+ },
+ },
+});
diff --git a/packages/nav-bar/demo/index.wxml b/packages/nav-bar/demo/index.wxml
new file mode 100644
index 00000000..0c68e2f7
--- /dev/null
+++ b/packages/nav-bar/demo/index.wxml
@@ -0,0 +1,14 @@
+
+
+
+
+
+
+
+
diff --git a/packages/nav-bar/test/__snapshots__/demo.spec.ts.snap b/packages/nav-bar/test/__snapshots__/demo.spec.ts.snap
new file mode 100644
index 00000000..ea26da63
--- /dev/null
+++ b/packages/nav-bar/test/__snapshots__/demo.spec.ts.snap
@@ -0,0 +1,125 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render demo and match snapshot 1`] = `
+
+
+
+
+ 基础用法
+
+
+
+
+
+
+
+
+
+
+ 标题
+
+
+
+ 按钮
+
+
+
+
+
+
+
+
+
+
+ 高级用法
+
+
+
+
+
+
+
+
+
+ 返回
+
+
+
+ 标题
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/packages/nav-bar/test/demo.spec.ts b/packages/nav-bar/test/demo.spec.ts
new file mode 100644
index 00000000..4c3798cb
--- /dev/null
+++ b/packages/nav-bar/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();
+});
diff --git a/packages/notice-bar/test/__snapshots__/demo.spec.ts.snap b/packages/notice-bar/test/__snapshots__/demo.spec.ts.snap
new file mode 100644
index 00000000..ebe24efb
--- /dev/null
+++ b/packages/notice-bar/test/__snapshots__/demo.spec.ts.snap
@@ -0,0 +1,249 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render demo and match snapshot 1`] = `
+
+
+
+
+ 基础用法
+
+
+
+
+
+
+
+
+
+ 在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。
+
+
+
+
+
+
+
+
+
+
+ 滚动模式
+
+
+
+
+
+
+ 技术是开发它的人的共同灵魂。
+
+
+
+
+
+
+
+
+
+
+ 在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。
+
+
+
+
+
+
+
+
+
+
+ 多行展示
+
+
+
+
+
+
+ 在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。
+
+
+
+
+
+
+
+
+
+
+ 通知栏模式
+
+
+
+
+
+
+ 技术是开发它的人的共同灵魂。
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 技术是开发它的人的共同灵魂。
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 自定义样式
+
+
+
+
+
+
+
+
+
+ 技术是开发它的人的共同灵魂。
+
+
+
+
+
+
+
+
+`;