blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

fix(ImagePreview): stop animation during initialization ()

Browse Source
This commit is contained in:
inottn 2023-05-22 21:42:20 +08:00 committed by GitHub
parent 7139898d3a
commit e98e514acf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 3 deletions

11
packages/vant/src/image-preview/ImagePreviewItem.tsx

@ -20,7 +20,7 @@ import {
// Composables // Composables
import { useTouch } from '../composables/use-touch'; import { useTouch } from '../composables/use-touch';
import { useEventListener, useRect } from '@vant/use'; import { raf, useEventListener, useRect } from '@vant/use';
// Components // Components
import { Image } from '../image'; import { Image } from '../image';
@ -63,6 +63,7 @@ export default defineComponent({
moveY: 0, moveY: 0,
moving: false, moving: false,
zooming: false, zooming: false,
initializing: false,
imageRatio: 0, imageRatio: 0,
}); });
@ -75,9 +76,9 @@ export default defineComponent({
let initialMoveY = 0; let initialMoveY = 0;
const imageStyle = computed(() => { const imageStyle = computed(() => {
const { scale, moveX, moveY, moving, zooming } = state; const { scale, moveX, moveY, moving, zooming, initializing } = state;
const style: CSSProperties = { const style: CSSProperties = {
transitionDuration: zooming || moving ? '0s' : '.3s', transitionDuration: zooming || moving || initializing ? '0s' : '.3s',
}; };
if (scale !== 1 || isLongImage.value) { if (scale !== 1 || isLongImage.value) {
@ -330,6 +331,10 @@ export default defineComponent({
if (isLongImage.value) { if (isLongImage.value) {
initialMoveY = (imageRatio * rootWidth - rootHeight) / 2; initialMoveY = (imageRatio * rootWidth - rootHeight) / 2;
state.moveY = initialMoveY; state.moveY = initialMoveY;
state.initializing = true;
raf(() => {
state.initializing = false;
});
} }
resetScale(); resetScale();