test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-11-30 02:48:55 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

优化弹框样式

Browse Source
This commit is contained in:
2betop 2020-10-20 17:21:21 +08:00
parent 633cd09384
commit 72e5fcf490
3 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
scss/components/_modal.scss
View File

@ -1,6 +1,9 @@
.is-modalOpened {
overflow: hidden;
padding-right: px2rem(15px);
&.has-scrollbar {
padding-right: px2rem(15px);
}
.#{$ns}Modal {
overflow-x: hidden;

7
src/components/Drawer.tsx
View File

@ -84,6 +84,9 @@ export class Drawer extends React.Component<DrawerProps, DrawerState> {
handleEnter = () => {
document.body.classList.add(`is-modalOpened`);
if (document.body.scrollHeight > window.innerHeight) {
document.body.classList.add(`has-scrollbar`);
}
};
handleEntered = () => {
@ -95,8 +98,10 @@ export class Drawer extends React.Component<DrawerProps, DrawerState> {
document.activeElement && (document.activeElement as HTMLElement).blur();
onExited && onExited();
setTimeout(() => {
document.querySelector('.amis-dialog-widget') ||
if (!document.querySelector('.amis-dialog-widget')) {
document.body.classList.remove(`is-modalOpened`);
document.body.classList.remove(`has-scrollbar`);
}
}, 200);
};

7
src/components/Modal.tsx
View File

@ -144,6 +144,9 @@ export class Modal extends React.Component<ModalProps, ModalState> {
handleEnter = () => {
document.body.classList.add(`is-modalOpened`);
if (document.body.scrollHeight > window.innerHeight) {
document.body.classList.add(`has-scrollbar`);
}
};
handleEntered = () => {
@ -155,8 +158,10 @@ export class Modal extends React.Component<ModalProps, ModalState> {
const onExited = this.props.onExited;
onExited && onExited();
setTimeout(() => {
document.querySelector('.amis-dialog-widget') ||
if (!document.querySelector('.amis-dialog-widget')) {
document.body.classList.remove(`is-modalOpened`);
document.body.classList.remove(`has-scrollbar`);
}
}, 200);
};