mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[improvement] ImagePreview: add fade transition (#2196)
This commit is contained in:
parent
66c940d672
commit
d14f9cb5dc
@ -1,4 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<transition name="van-fade">
|
||||||
<div
|
<div
|
||||||
v-if="value"
|
v-if="value"
|
||||||
:class="b()"
|
:class="b()"
|
||||||
@ -36,6 +37,7 @@
|
|||||||
</swipe-item>
|
</swipe-item>
|
||||||
</swipe>
|
</swipe>
|
||||||
</div>
|
</div>
|
||||||
|
</transition>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
@ -176,7 +178,7 @@ export default create({
|
|||||||
|
|
||||||
onTouchStart(event) {
|
onTouchStart(event) {
|
||||||
const { touches } = event;
|
const { touches } = event;
|
||||||
const { offsetX } = this.$refs.swipe;
|
const { offsetX = 0 } = this.$refs.swipe || {};
|
||||||
|
|
||||||
if (touches.length === 1 && this.scale !== 1) {
|
if (touches.length === 1 && this.scale !== 1) {
|
||||||
this.startMove(event);
|
this.startMove(event);
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
exports[`render image 1`] = `
|
exports[`render image 1`] = `
|
||||||
<div class="van-image-preview">
|
<div class="van-image-preview" name="van-fade">
|
||||||
<div class="van-image-preview__index">
|
<div class="van-image-preview__index">
|
||||||
1/3
|
1/3
|
||||||
</div>
|
</div>
|
||||||
@ -23,7 +23,7 @@ exports[`render image 1`] = `
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`zoom 1`] = `
|
exports[`zoom 1`] = `
|
||||||
<div class="van-image-preview">
|
<div class="van-image-preview" name="van-fade">
|
||||||
<div class="van-image-preview__index">
|
<div class="van-image-preview__index">
|
||||||
1/3
|
1/3
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,7 +1,9 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import ImagePreview from '..';
|
import ImagePreview from '..';
|
||||||
import ImagePreviewVue from '../ImagePreview';
|
import ImagePreviewVue from '../ImagePreview';
|
||||||
import { mount, trigger, triggerDrag } from '../../../test/utils';
|
import { mount, trigger, triggerDrag, transitionStub } from '../../../test/utils';
|
||||||
|
|
||||||
|
transitionStub();
|
||||||
|
|
||||||
function triggerZoom(el, x, y) {
|
function triggerZoom(el, x, y) {
|
||||||
trigger(el, 'touchstart', 0, 0, { x, y });
|
trigger(el, 'touchstart', 0, 0, { x, y });
|
||||||
|
Loading…
x
Reference in New Issue
Block a user