github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: upload height error, close #5298

pull/5317/head
tangjinzhou 2022-03-02 14:05:33 +08:00
parent 55e0ad7f92
commit 991fa776cf
1 changed files with 15 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/upload/UploadList/listAnimation.ts
View File

@ -2,15 +2,15 @@ import { addClass, removeClass } from '../../vc-util/Dom/class';
import { nextTick } from 'vue';
import type { CSSMotionProps } from '../../_util/transition';
const listAnimation = (name): CSSMotionProps => {
const listAnimation = (name = 'ant-motion-collapse'): CSSMotionProps => {
return {
name,
appear: true,
css: true,
onBeforeEnter: (node: HTMLDivElement) => {
addClass(node, name);
node.style.height = '0px';
node.style.opacity = '0';
addClass(node, name);
},
onEnter: (node: HTMLDivElement) => {
nextTick(() => {
@ -19,14 +19,16 @@ const listAnimation = (name): CSSMotionProps => {
});
},
onAfterEnter: (node: HTMLDivElement) => {
if (node) removeClass(node, name);
node.style.height = undefined;
node.style.opacity = undefined;
if (node) {
removeClass(node, name);
node.style.height = null;
node.style.opacity = null;
}
},
onBeforeLeave: (node: HTMLDivElement) => {
addClass(node, name);
node.style.height = `${node.offsetHeight}px`;
node.style.opacity = undefined;
node.style.opacity = null;
},
onLeave: (node: HTMLDivElement) => {
setTimeout(() => {
@ -35,9 +37,13 @@ const listAnimation = (name): CSSMotionProps => {
});
},
onAfterLeave: (node: HTMLDivElement) => {
if (node) removeClass(node, name);
node.style.height = undefined;
node.style.opacity = undefined;
if (node) {
removeClass(node, name);
if (node.style) {
node.style.height = null;
node.style.opacity = null;
}
}
},
};
};