feat(wx-react): 简化实例管理模块

areslabs · Aug 8, 2019 · aa3bdd7 · aa3bdd7
1 parent 7056cd6
commit aa3bdd7
Show file tree

Hide file tree

Showing 7 changed files with 52 additions and 82 deletions.
diff --git a/packages/wx-react-native/miniprogram_dist/component/WXFlatList/index.js b/packages/wx-react-native/miniprogram_dist/component/WXFlatList/index.js
@@ -42,16 +42,7 @@ Component({
     },
 
     detached() {
-        const compInst = instanceManager.getCompInstByUUID(this.data.diuu)
-        compInst.componentWillUnmount && compInst.componentWillUnmount()
-
-        if (compInst._p) {
-            compInst._p._c = compInst._p._c.filter(
-                diuu => diuu !== this.data.diuu
-            )
-        }
-
-        instanceManager.removeUUID(this.data.diuu)
+        instanceManager.removeWxInst(this.data.diuu)
     },
 
     methods: {

diff --git a/packages/wx-react-native/miniprogram_dist/component/WXPicker/index.js b/packages/wx-react-native/miniprogram_dist/component/WXPicker/index.js
@@ -24,7 +24,7 @@ Component({
 
 
     detached() {
-        instanceManager.removeUUID(this.data.diuu)
+        instanceManager.removeWxInst(this.data.diuu)
     },
 
     methods: {

diff --git a/packages/wx-react-native/miniprogram_dist/component/WXSectionList/index.js b/packages/wx-react-native/miniprogram_dist/component/WXSectionList/index.js
@@ -34,16 +34,7 @@ Component({
     },
 
     detached() {
-        const compInst = instanceManager.getCompInstByUUID(this.data.diuu)
-        compInst.componentWillUnmount && compInst.componentWillUnmount()
-
-        if (compInst._p) {
-            compInst._p._c = compInst._p._c.filter(
-                diuu => diuu !== this.data.diuu
-            )
-        }
-
-        instanceManager.removeUUID(this.data.diuu)
+        instanceManager.removeWxInst(this.data.diuu)
     },
 
     methods: {

diff --git a/packages/wx-react/miniprogram_dist/AllComponent.js b/packages/wx-react/miniprogram_dist/AllComponent.js
@@ -9,7 +9,18 @@
 import instanceManager from "./InstanceManager";
 import render from "./render";
 import getChangePath from "./getChangePath";
-import {getCurrentContext, DEFAULTCONTAINERSTYLE, setDeepData, HOCKEY, FR_DONE, FR_PENDING, recursionMount, EMPTY_FUNC, getRealOc} from './util'
+import {
+    getCurrentContext,
+    DEFAULTCONTAINERSTYLE,
+    setDeepData,
+    HOCKEY,
+    FR_DONE,
+    FR_PENDING,
+    recursionMount,
+    EMPTY_FUNC,
+    getRealOc,
+    invokeWillUnmount
+} from './util'
 import reactUpdate from './ReactUpdate'
 import shallowEqual from './shallowEqual'
 import getObjSubData from './getObjSubData'
@@ -612,20 +623,3 @@ function recursionCollectChild(inst, descendantList) {
     descendantList.push(inst)
 }
 
-
-/**
- * 由于微信小程序的detached的生命周期，触发并不准确，另外并不是每一个React组件都会有对应的小程序组件，所以willUnmount并没有选择通过
- * detached生命周期实现，比如Hoc组件 没有对应的小程序组件， 自定义组件render 返回null 也不会有对应的小程序组件
- * @param oldChildren
- */
-function invokeWillUnmount(oldChildren) {
-    for(let i = 0; i < oldChildren.length; i ++ ) {
-        const item = oldChildren[i]
-
-        if(item.componentWillUnmount) {
-            item.componentWillUnmount()
-        }
-
-        instanceManager.removeCompInst(item.__diuu__)
-    }
-}
diff --git a/packages/wx-react/miniprogram_dist/InstanceManager.js b/packages/wx-react/miniprogram_dist/InstanceManager.js
@@ -12,10 +12,6 @@
 class InstanceManager {
     innerMap = {}
 
-    // 由于语法错误的存在，比如多层级传递xxComponent, 会出现render过程构造出的uuid，在微信过程没有与之对应的实例。
-    // 故需要在页面onUnload的定期处理
-    unmarriedSet = new Set([])
-
     wxInstSuffix = "__wx"
 
     compInstSuffix = "__comp"
@@ -28,7 +24,6 @@ class InstanceManager {
     setCompInst(uuid, comp) {
         const key = `${uuid}${this.compInstSuffix}`
         this.innerMap[key] = comp
-        this.unmarriedSet.add(uuid)
     }
 
     getWxInstByUUID(uuid) {
@@ -39,7 +34,6 @@ class InstanceManager {
     setWxCompInst(uuid, comp) {
         const key = `${uuid}${this.wxInstSuffix}`
         this.innerMap[key] = comp
-        this.unmarriedSet.delete(uuid)
     }
 
     removeWxInst(uuid) {
@@ -48,59 +42,38 @@ class InstanceManager {
             delete this.innerMap[key]
         }
     }
-
-    removeCompInst(uuid) {
-        const key = `${uuid}${this.compInstSuffix}`
-        if (this.innerMap[key]) {
-            delete this.innerMap[key]
-        }
-    }
-
-    removeUnmarred() {
-        if (this.unmarriedSet.size > 0) {
-            const unmarriedSet = new Set([])
-            this.unmarriedSet.forEach(uuid => {
-                const compKey = `${uuid}${this.compInstSuffix}`
-
-                const comp = this.innerMap[compKey]
-                if (comp.hocWrapped) {
-                    unmarriedSet.add(uuid)
-                } else {
-                    delete this.innerMap[compKey]
-                }
-            })
-
-            this.unmarriedSet = unmarriedSet
-        }
-    }
 
+    // 基本组件的移除操作
     removeUUID(uuid) {
         const wxKey = `${uuid}${this.wxInstSuffix}`
         const compKey = `${uuid}${this.compInstSuffix}`
 
         const compInst = this.innerMap[compKey]
-        if (typeof compInst._ref === 'function') {
+        if (compInst && typeof compInst._ref === 'function') {
             compInst._ref(null)
         }
 
         delete this.innerMap[wxKey]
         delete this.innerMap[compKey]
+    }
+
+    removeCompInst(uuid) {
+        const key = `${uuid}${this.compInstSuffix}`
+        if (this.innerMap[key]) {
+
+            if (typeof this.innerMap[key]._ref === 'function') {
+                this.innerMap[key]._ref(null)
+            }
 
-        this.unmarriedSet.delete(uuid)
+            delete this.innerMap[key]
+        }
     }
 
     compExist(comp) {
         const compKey = `${comp.__diuu__}${this.compInstSuffix}`
 
         return !!this.innerMap[compKey]
     }
-
-    isInstanceOf(uuid, clazz) {
-        const compKey = `${uuid}${this.compInstSuffix}`
-        const inst = this.innerMap[compKey]
-
-        return inst instanceof clazz
-    }
 }
 
 export default new InstanceManager()
diff --git a/packages/wx-react/miniprogram_dist/WxNormalComp.js b/packages/wx-react/miniprogram_dist/WxNormalComp.js
@@ -9,7 +9,7 @@
 import {render, createElement, HocComponent, unstable_batchedUpdates} from "./index"
 import geneUUID from "./geneUUID"
 import instanceManager from "./InstanceManager"
-import {FR_DONE, recursionUnmount} from './util'
+import {FR_DONE, recursionUnmount, recursiveGetC, invokeWillUnmount} from './util'
 
 
 export default function (CompMySelf, RNApp) {
@@ -101,7 +101,11 @@ export default function (CompMySelf, RNApp) {
         o.methods.onUnload = function () {
             const compInst = instanceManager.getCompInstByUUID(this.data.diuu)
             compInst.componentWillUnfocus && compInst.componentWillUnfocus()
-            instanceManager.removeUnmarred()
+
+            const allChildren = []
+            recursiveGetC(compInst, allChildren)
+            allChildren.push(compInst)
+            invokeWillUnmount(allChildren)
         }
     }
     return o

diff --git a/packages/wx-react/miniprogram_dist/util.js b/packages/wx-react/miniprogram_dist/util.js
@@ -151,7 +151,7 @@ export function getRealOc(oc, nc, r) {
     }
 }
 
-function recursiveGetC(c, r) {
+export function recursiveGetC(c, r) {
     for (let i = 0; i < c._c.length; i ++ ) {
         const item = c._c[i]
         const comp = instanceManager.getCompInstByUUID(item)
@@ -160,3 +160,20 @@ function recursiveGetC(c, r) {
 
     r.push(c)
 }
+
+/**
+ * 由于微信小程序的detached的生命周期，触发并不准确，另外并不是每一个React组件都会有对应的小程序组件，所以willUnmount并没有选择通过
+ * detached生命周期实现，比如Hoc组件 没有对应的小程序组件， 自定义组件render 返回null 也不会有对应的小程序组件
+ * @param oldChildren
+ */
+export function invokeWillUnmount(oldChildren) {
+    for(let i = 0; i < oldChildren.length; i ++ ) {
+        const item = oldChildren[i]
+
+        if(item.componentWillUnmount) {
+            item.componentWillUnmount()
+        }
+
+        instanceManager.removeCompInst(item.__diuu__)
+    }
+}