test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-03 04:30:06 +08:00
Code Issues Actions 100 Packages Projects Releases Wiki Activity

fix: delete drawer in child and re-render, no push started

Browse Source
This commit is contained in:
jljsj 2019-07-17 19:55:59 +08:00
parent a9a24d0d39
commit d4c90d4a3b
2 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/drawer/index.tsx
View File

@ -63,9 +63,19 @@ class Drawer extends React.Component<DrawerProps & ConfigConsumerProps, IDrawerS
push: false,
};
parentDrawer: Drawer;
parentDrawer: Drawer | null;
destroyClose: boolean;
public componentDidMount() {
// fix: delete drawer in child and re-render, no push started.
// <Drawer>{show && <Drawer />}</Drawer>
const { visible } = this.props;
if (visible && this.parentDrawer) {
this.parentDrawer.push();
}
}
public componentDidUpdate(preProps: DrawerProps) {
const { visible } = this.props;
if (preProps.visible !== visible && this.parentDrawer) {
@ -77,6 +87,14 @@ class Drawer extends React.Component<DrawerProps & ConfigConsumerProps, IDrawerS
}
}
public componentWillUnmount() {
// unmount drawer in child, clear push.
if (this.parentDrawer) {
this.parentDrawer.pull();
this.parentDrawer = null;
}
}
push = () => {
this.setState({
push: true,
@ -186,7 +204,7 @@ class Drawer extends React.Component<DrawerProps & ConfigConsumerProps, IDrawerS
);
};
// render Provider for Multi-level drawe
// render Provider for Multi-level drawer
renderProvider = (value: Drawer) => {
const {
prefixCls,

7
components/drawer/style/drawer.less
View File

@ -11,10 +11,10 @@
z-index: @zindex-modal;
width: 0%;
height: 100%;
transition: transform @animation-duration-slow @ease-base-out;
> * {
transition: transform @animation-duration-slow @ease-base-in,
box-shadow @animation-duration-slow @ease-base-in;
transition: transform @animation-duration-slow @ease-base-out,
box-shadow @animation-duration-slow @ease-base-out;
}
&-content-wrapper {
@ -197,7 +197,6 @@
transition: opacity @animation-duration-slow linear, height 0s ease @animation-duration-slow;
}
&-open {
transition: transform @animation-duration-slow @ease-base-out;
&-content {
box-shadow: @shadow-2;
}