diff --git a/src/swipe/index.js b/src/swipe/index.js
index bd74a4843..401db97cd 100644
--- a/src/swipe/index.js
+++ b/src/swipe/index.js
@@ -166,7 +166,10 @@ export default createComponent({
 
       clearTimeout(this.timer);
 
-      const rect = this.$el.getBoundingClientRect();
+      const rect = {
+        width: this.$el.offsetWidth,
+        height: this.$el.offsetHeight,
+      };
 
       this.rect = rect;
       this.swiping = true;
diff --git a/src/swipe/test/__snapshots__/demo.spec.js.snap b/src/swipe/test/__snapshots__/demo.spec.js.snap
index 745aef78c..2d41fe2cd 100644
--- a/src/swipe/test/__snapshots__/demo.spec.js.snap
+++ b/src/swipe/test/__snapshots__/demo.spec.js.snap
@@ -4,44 +4,44 @@ exports[`renders demo correctly 1`] = `
 <div>
   <div>
     <div class="van-swipe">
-      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px); width: 400px;">
-        <div class="van-swipe-item" style="width: 100px;">1</div>
-        <div class="van-swipe-item" style="width: 100px;">2</div>
-        <div class="van-swipe-item" style="width: 100px;">3</div>
-        <div class="van-swipe-item" style="width: 100px;">4</div>
+      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px);">
+        <div class="van-swipe-item">1</div>
+        <div class="van-swipe-item">2</div>
+        <div class="van-swipe-item">3</div>
+        <div class="van-swipe-item">4</div>
       </div>
       <div class="van-swipe__indicators"><i class="van-swipe__indicator van-swipe__indicator--active" style="background-color: white;"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
     </div>
   </div>
   <div>
     <div class="van-swipe">
-      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px); width: 400px;">
-        <div class="van-swipe-item" style="width: 100px;"><img data-src="https://img01.yzcdn.cn/vant/apple-1.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
-        <div class="van-swipe-item" style="width: 100px;"><img data-src="https://img01.yzcdn.cn/vant/apple-2.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
-        <div class="van-swipe-item" style="width: 100px;"><img data-src="https://img01.yzcdn.cn/vant/apple-3.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
-        <div class="van-swipe-item" style="width: 100px;"><img data-src="https://img01.yzcdn.cn/vant/apple-4.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px);">
+        <div class="van-swipe-item"><img data-src="https://img01.yzcdn.cn/vant/apple-1.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+        <div class="van-swipe-item"><img data-src="https://img01.yzcdn.cn/vant/apple-2.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+        <div class="van-swipe-item"><img data-src="https://img01.yzcdn.cn/vant/apple-3.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
+        <div class="van-swipe-item"><img data-src="https://img01.yzcdn.cn/vant/apple-4.jpg" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" lazy="loading"></div>
       </div>
       <div class="van-swipe__indicators"><i class="van-swipe__indicator van-swipe__indicator--active"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
     </div>
   </div>
   <div>
     <div class="van-swipe">
-      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px); width: 400px;">
-        <div class="van-swipe-item" style="width: 100px;">1</div>
-        <div class="van-swipe-item" style="width: 100px;">2</div>
-        <div class="van-swipe-item" style="width: 100px;">3</div>
-        <div class="van-swipe-item" style="width: 100px;">4</div>
+      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px);">
+        <div class="van-swipe-item">1</div>
+        <div class="van-swipe-item">2</div>
+        <div class="van-swipe-item">3</div>
+        <div class="van-swipe-item">4</div>
       </div>
       <div class="van-swipe__indicators"><i class="van-swipe__indicator van-swipe__indicator--active" style="background-color: white;"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
     </div>
   </div>
   <div>
     <div class="demo-swipe--vertical van-swipe" style="height: 200px;">
-      <div class="van-swipe__track van-swipe__track--vertical" style="transition-duration: 0ms; transform: translateY(0px); height: 400px;">
-        <div class="van-swipe-item" style="height: 100px;">1</div>
-        <div class="van-swipe-item" style="height: 100px;">2</div>
-        <div class="van-swipe-item" style="height: 100px;">3</div>
-        <div class="van-swipe-item" style="height: 100px;">4</div>
+      <div class="van-swipe__track van-swipe__track--vertical" style="transition-duration: 0ms; transform: translateY(0px); height: 800px;">
+        <div class="van-swipe-item" style="height: 200px;">1</div>
+        <div class="van-swipe-item" style="height: 200px;">2</div>
+        <div class="van-swipe-item" style="height: 200px;">3</div>
+        <div class="van-swipe-item" style="height: 200px;">4</div>
       </div>
       <div class="van-swipe__indicators van-swipe__indicators--vertical"><i class="van-swipe__indicator van-swipe__indicator--active" style="background-color: white;"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i><i class="van-swipe__indicator"></i></div>
     </div>
@@ -59,11 +59,11 @@ exports[`renders demo correctly 1`] = `
   </div>
   <div>
     <div class="van-swipe">
-      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px); width: 400px;">
-        <div class="van-swipe-item" style="width: 100px;">1</div>
-        <div class="van-swipe-item" style="width: 100px;">2</div>
-        <div class="van-swipe-item" style="width: 100px;">3</div>
-        <div class="van-swipe-item" style="width: 100px;">4</div>
+      <div class="van-swipe__track" style="transition-duration: 0ms; transform: translateX(0px);">
+        <div class="van-swipe-item">1</div>
+        <div class="van-swipe-item">2</div>
+        <div class="van-swipe-item">3</div>
+        <div class="van-swipe-item">4</div>
       </div>
       <div class="custom-indicator">1/4</div>
     </div>
diff --git a/src/swipe/test/demo.spec.js b/src/swipe/test/demo.spec.js
index 43aab9265..5c70922b5 100644
--- a/src/swipe/test/demo.spec.js
+++ b/src/swipe/test/demo.spec.js
@@ -1,17 +1,4 @@
 import Demo from '../demo';
 import { snapshotDemo } from '../../../test/demo';
-import { mockGetBoundingClientRect } from '../../../test';
 
-let restore;
-
-snapshotDemo(Demo, {
-  beforeTest: () => {
-    restore = mockGetBoundingClientRect({
-      width: 100,
-      height: 100,
-    });
-  },
-  afterTest: () => {
-    restore();
-  },
-});
+snapshotDemo(Demo);