diff --git a/package.json b/package.json index a0e6828..4d60947 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-activation", - "version": "0.3.2", + "version": "0.3.3", "description": " for React like in vue", "main": "index.js", "scripts": { diff --git a/src/core/AliveScope.js b/src/core/AliveScope.js index 9a76f83..1c71afc 100644 --- a/src/core/AliveScope.js +++ b/src/core/AliveScope.js @@ -8,18 +8,14 @@ import Keeper from './Keeper' export default class AliveScope extends Component { store = new Map() nodes = new Map() + keepers = new Map() - // FIXME: 每次 update 均触发 forceUpdate,可能存在性能问题,待验证 update = (id, params) => new Promise(resolve => { - const node = this.nodes.get(id) || null - const isNew = !node + const keeper = this.keepers.get(id) + const isNew = !keeper const now = Date.now() - - if (isNew) { - this.helpers = { ...this.helpers } - } - + const node = this.nodes.get(id) || null this.nodes.set(id, { id, createTime: now, @@ -28,7 +24,14 @@ export default class AliveScope extends Component { ...params }) - this.forceUpdate(resolve) + if (isNew) { + this.helpers = { ...this.helpers } + + this.forceUpdate(resolve) + } else { + const { children, bridgeProps } = params + keeper.setState({ children, bridgeProps }, resolve) + } }) keep = (id, params) => new Promise(resolve => { @@ -122,7 +125,15 @@ export default class AliveScope extends Component { {children}
{[...this.nodes.values()].map(({ children, ...props }) => ( - + { + this.keepers.set(props.id, keeper) + }} + > {children} ))} diff --git a/src/core/KeepAlive.js b/src/core/KeepAlive.js index 2cdb298..6663f57 100644 --- a/src/core/KeepAlive.js +++ b/src/core/KeepAlive.js @@ -45,9 +45,9 @@ class KeepAlive extends Component { }, 100) releaseUpdateTimes = debounce(() => { this.updateTimes = 0 - }, 32) + }, 16) needForceStopUpdate = () => { - const needForceStopUpdate = this.updateTimes > 16 + const needForceStopUpdate = this.updateTimes > 64 if (needForceStopUpdate) { this.errorTips() diff --git a/src/core/Keeper.js b/src/core/Keeper.js index 6f87b12..c2bda2f 100644 --- a/src/core/Keeper.js +++ b/src/core/Keeper.js @@ -9,6 +9,16 @@ import { LIFECYCLE_ACTIVATE, LIFECYCLE_UNACTIVATE } from './lifecycles' export default class Keeper extends Component { listeners = new Map() wrapper = null + + constructor(props, ...rest) { + super(props, ...rest) + + this.state = { + children: props.children, + bridgeProps: props.bridgeProps + } + } + componentDidMount() { const { store, id } = this.props const listeners = this.listeners @@ -32,7 +42,7 @@ export default class Keeper extends Component { } componentWillUnmount() { - const { store, id } = this.props + const { store, keepers, id } = this.props // 卸载前尝试归位 DOM 节点 try { const cache = store.get(id) @@ -43,6 +53,7 @@ export default class Keeper extends Component { // console.error(error) // do nothing } store.delete(id) + keepers.delete(id) } [LIFECYCLE_ACTIVATE]() { @@ -105,7 +116,8 @@ export default class Keeper extends Component { } render() { - const { id, children, bridgeProps, ...props } = this.props + const { id, ...props } = this.props + const { children, bridgeProps } = this.state return (