fix(ImagePreview): scale event param

src/image-preview/ImagePreview.js

@@ -147,6 +147,7 @@ export default createComponent({
           {this.images.map((image) => (
             <ImagePreviewItem
               src={image}
+              active={this.active}
               maxZoom={this.maxZoom}
               minZoom={this.minZoom}
               onScale={this.emitScale}

src/image-preview/ImagePreviewItem.js

@@ -25,6 +25,7 @@ export default {
 
   props: {
     src: String,
+    active: Number,
     minZoom: [Number, String],
     maxZoom: [Number, String],
   },
@@ -60,8 +61,7 @@ export default {
   },
 
   methods: {
-    startMove(event) {
+    startMove() {
-      this.touchStart(event);
       this.setMaxMove();
       this.moving = true;
       this.startMoveX = this.moveX;
@@ -80,6 +80,9 @@ export default {
       if (this.displayWidth && this.displayHeight) {
         this.maxMoveX = Math.max(0, (displayWidth * scale - windowWidth) / 2);
         this.maxMoveY = Math.max(0, (displayHeight * scale - windowHeight) / 2);
+      } else {
+        this.maxMoveX = 0;
+        this.maxMoveY = 0;
       }
     },
 
@@ -109,10 +112,11 @@ export default {
       const { touches } = event;
       const { offsetX = 0 } = this;
 
+      this.touchStart(event);
       this.touchStartTime = new Date();
 
       if (touches.length === 1 && this.scale !== 1) {
-        this.startMove(event);
+        this.startMove();
       } else if (touches.length === 2 && !offsetX) {
         this.startZoom(event);
       }

src/image-preview/test/__snapshots__/index.spec.js.snap

@@ -61,7 +61,7 @@ exports[`set show-index prop to false 1`] = `
 `;
 
 exports[`zoom 1`] = `
-<div class="van-image van-image-preview__image" style="transition-duration: 0s; transform: scale(2, 2) translate(0px, 0px);" data-index="0"><img src="https://img.yzcdn.cn/1.png" class="van-image__img" style="object-fit: contain;">
+<div class="van-image van-image-preview__image" style="transition-duration: 0s; transform: scale(2, 2) translate(0px, 0px);"><img src="https://img.yzcdn.cn/1.png" class="van-image__img" style="object-fit: contain;">
   <div class="van-image__loading">
     <div class="van-loading van-loading--spinner"><span class="van-loading__spinner van-loading__spinner--spinner"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
   </div>

src/image-preview/test/index.spec.js

@@ -27,15 +27,14 @@ test('render image', async () => {
 
   await later();
 
-  const swipe = wrapper.find('.van-swipe__track');
+  const swipe = wrapper.find('.van-swipe-item');
   triggerDrag(swipe, 500, 0);
   expect(wrapper.emitted('input')).toBeFalsy();
-  triggerDrag(swipe, 0, 0);
-
-  await later(250);
-
-  expect(wrapper.emitted('input')[0][0]).toBeFalsy();
   expect(wrapper.emitted('change')[0][0]).toEqual(2);
+
+  triggerDrag(swipe, 0, 0);
+  await later(250);
+  expect(wrapper.emitted('input')[0][0]).toEqual(false);
 });
 
 test('closeable prop', () => {
@@ -116,21 +115,29 @@ test('function call', (done) => {
   });
 });
 
-test('double click', async (done) => {
+test('double click', async () => {
-  const instance = ImagePreview(images);
+  const onScale = jest.fn();
+  const instance = ImagePreview({
+    images,
+    onScale,
+  });
 
   await later();
-  const swipe = instance.$el.querySelector('.van-swipe__track');
+  const swipe = instance.$el.querySelector('.van-swipe-item');
   triggerDrag(swipe, 0, 0);
   triggerDrag(swipe, 0, 0);
-  expect(instance.scale).toEqual(2);
+  expect(onScale).toHaveBeenCalledWith({
+    index: 0,
+    scale: 2,
+  });
 
   await later();
-
   triggerDrag(swipe, 0, 0);
   triggerDrag(swipe, 0, 0);
-  expect(instance.scale).toEqual(1);
+  expect(onScale).toHaveBeenLastCalledWith({
-  done();
+    index: 0,
+    scale: 1,
+  });
 });
 
 test('onClose option', () => {

src/uploader/test/index.spec.js

@@ -450,7 +450,7 @@ test('close-preview event', async () => {
   wrapper.find('.van-image').trigger('click');
 
   const preview = document.querySelector('.van-image-preview');
-  const swipe = preview.querySelector('.van-swipe__track');
+  const swipe = preview.querySelector('.van-swipe-item');
   triggerDrag(swipe, 0, 0);
 
   await later(300);

test/event.ts

@@ -20,8 +20,8 @@ function getTouch(el: HTMLElement | Window, x: number, y: number) {
 export function trigger(
   wrapper: Wrapper<Vue> | HTMLElement | Window,
   eventName: string,
-  x: number = 0,
+  x = 0,
-  y: number = 0,
+  y = 0,
   options: any = {}
 ) {
   const el = 'element' in wrapper ? wrapper.element : wrapper;