diff --git a/index.d.ts b/index.d.ts index 19c6e68..7dfb0a8 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,6 +1,14 @@ -import { ReactNode, ReactNodeArray, Context, Component, ComponentType } from 'react' +import { + ReactNode, + ReactNodeArray, + Context, + Component, + ComponentType, +} from 'react' -export declare type GetProps = C extends ComponentType ? P : never; +export declare type GetProps = C extends ComponentType ? P : never + +type DivProps = React.HTMLAttributes export interface KeepAliveProps { children: ReactNode | ReactNodeArray @@ -10,6 +18,8 @@ export interface KeepAliveProps { when?: boolean | Array | (() => boolean | Array) saveScrollPosition?: boolean | string autoFreeze?: boolean + wrapperProps?: DivProps + contentProps?: DivProps [key: string]: any } @@ -53,5 +63,9 @@ export interface AliveController { } export function useAliveController(): AliveController -export declare function withActivation>>(component: C): C -export declare function withAliveScope>>(component: C): C +export declare function withActivation>>( + component: C +): C +export declare function withAliveScope>>( + component: C +): C diff --git a/src/core/KeepAlive.js b/src/core/KeepAlive.js index de81a56..24b1506 100644 --- a/src/core/KeepAlive.js +++ b/src/core/KeepAlive.js @@ -244,11 +244,13 @@ class KeepAlive extends Component { } render() { + const { wrapperProps = {} } = this.props || {} return (
{ this.placeholder = node }} @@ -259,9 +261,20 @@ class KeepAlive extends Component { // 兼容 SSR 服务端渲染 function SSRKeepAlive({ children }) { + const { wrapperProps = {}, contentProps = {} } = this.props || {} return ( -
-
+
+
{children}
diff --git a/src/core/Keeper.js b/src/core/Keeper.js index 8b1dff8..9898395 100644 --- a/src/core/Keeper.js +++ b/src/core/Keeper.js @@ -57,7 +57,6 @@ export default class Keeper extends PureComponent { store.set(id, this.cache) } - unmounted = false safeSetState = (nextState, callback) => { // fix #170 @@ -82,9 +81,8 @@ export default class Keeper extends PureComponent { this.unmounted = true } - freezeTimeout = null - - ;[LIFECYCLE_ACTIVATE]() { + freezeTimeout = null; + [LIFECYCLE_ACTIVATE]() { clearTimeout(this.freezeTimeout) // 激活后,立即解冻 this.safeSetState({ @@ -94,7 +92,7 @@ export default class Keeper extends PureComponent { this.listeners.forEach((listener) => run(listener, [LIFECYCLE_ACTIVATE])) } - ;[LIFECYCLE_UNACTIVATE]() { + [LIFECYCLE_UNACTIVATE]() { this.eventBus.emit(LIFECYCLE_UNACTIVATE) const listeners = [...this.listeners] @@ -202,7 +200,7 @@ export default class Keeper extends PureComponent { }) render() { - const { id, autoFreeze = true, ...props } = this.props + const { id, autoFreeze = true, contentProps = {}, ...props } = this.props const { children, bridgeProps, key, freeze } = this.state return ( @@ -212,7 +210,12 @@ export default class Keeper extends PureComponent { this.wrapper = node }} > -
+
{React.Children.map(children, (child, idx) =>