fix: drawer throw error when unmounted

pull/3197/head^2
tanjinzhou 2021-03-12 14:35:13 +08:00
parent c1102df3f0
commit 848d6497e6
1 changed files with 58 additions and 54 deletions

View File

@ -242,7 +242,7 @@ const Drawer = defineComponent({
const { placement, levelMove, duration, ease, getContainer } = this.$props; const { placement, levelMove, duration, ease, getContainer } = this.$props;
if (!windowIsUndefined) { if (!windowIsUndefined) {
this.levelDom.forEach(dom => { this.levelDom.forEach(dom => {
if (this.isOpenChange || openTransition) { if (dom && (this.isOpenChange || openTransition)) {
/* eslint no-param-reassign: "error" */ /* eslint no-param-reassign: "error" */
dom.style.transition = `transform ${duration} ${ease}`; dom.style.transition = `transform ${duration} ${ease}`;
addEventListener(dom, transitionEnd, this.trnasitionEnd); addEventListener(dom, transitionEnd, this.trnasitionEnd);
@ -275,6 +275,8 @@ const Drawer = defineComponent({
if (right) { if (right) {
document.body.style.position = 'relative'; document.body.style.position = 'relative';
document.body.style.width = `calc(100% - ${right}px)`; document.body.style.width = `calc(100% - ${right}px)`;
clearTimeout(this.timeout);
if (this.dom) {
this.dom.style.transition = 'none'; this.dom.style.transition = 'none';
switch (placement) { switch (placement) {
case 'right': case 'right':
@ -289,7 +291,6 @@ const Drawer = defineComponent({
default: default:
break; break;
} }
clearTimeout(this.timeout);
this.timeout = setTimeout(() => { this.timeout = setTimeout(() => {
this.dom.style.transition = `${trannsformTransition},${widthTransition}`; this.dom.style.transition = `${trannsformTransition},${widthTransition}`;
this.dom.style.width = ''; this.dom.style.width = '';
@ -297,6 +298,7 @@ const Drawer = defineComponent({
this.dom.style.msTransform = ''; this.dom.style.msTransform = '';
}); });
} }
}
// 手机禁滚 // 手机禁滚
domArray.forEach((item, i) => { domArray.forEach((item, i) => {
if (!item) { if (!item) {
@ -317,6 +319,12 @@ const Drawer = defineComponent({
if (transitionStr) { if (transitionStr) {
document.body.style.overflowX = 'hidden'; document.body.style.overflowX = 'hidden';
} }
if (placement === 'right' && this.maskDom) {
this.maskDom.style.left = `-${right}px`;
this.maskDom.style.width = `calc(100% + ${right}px)`;
}
clearTimeout(this.timeout);
if (this.dom) {
this.dom.style.transition = 'none'; this.dom.style.transition = 'none';
let heightTransition; let heightTransition;
switch (placement) { switch (placement) {
@ -325,10 +333,6 @@ const Drawer = defineComponent({
this.dom.style.msTransform = `translateX(${right}px)`; this.dom.style.msTransform = `translateX(${right}px)`;
this.dom.style.width = '100%'; this.dom.style.width = '100%';
widthTransition = `width 0s ${ease} ${duration}`; widthTransition = `width 0s ${ease} ${duration}`;
if (this.maskDom) {
this.maskDom.style.left = `-${right}px`;
this.maskDom.style.width = `calc(100% + ${right}px)`;
}
break; break;
} }
case 'top': case 'top':
@ -342,7 +346,6 @@ const Drawer = defineComponent({
default: default:
break; break;
} }
clearTimeout(this.timeout);
this.timeout = setTimeout(() => { this.timeout = setTimeout(() => {
this.dom.style.transition = `${trannsformTransition},${ this.dom.style.transition = `${trannsformTransition},${
heightTransition ? `${heightTransition},` : '' heightTransition ? `${heightTransition},` : ''
@ -353,6 +356,7 @@ const Drawer = defineComponent({
this.dom.style.height = ''; this.dom.style.height = '';
}); });
} }
}
domArray.forEach((item, i) => { domArray.forEach((item, i) => {
if (!item) { if (!item) {
return; return;