feat: deriveDataFromProps逻辑抽离到/plugin-platform-alipay

NervJS · Nov 1, 2023 · 3c43d20 · 3c43d20
1 parent 2eb3ea1
commit 3c43d20
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 26 deletions.
diff --git a/packages/shared/src/runtime-hooks.ts b/packages/shared/src/runtime-hooks.ts
@@ -187,6 +187,8 @@ type ITaroHooks = {
   getMiniLifecycleImpl: () => MiniLifecycle
   /** 解决 React 生命周期名称的兼容问题 */
   getLifecycle: (instance, lifecyle) => Func | Array<Func> | undefined
+  /** 提供Hook，为不同平台提供修改生命周期 */
+  modifyMiniLifecycle: (defaultConfig:MiniLifecycle, options:any) => any
   /** 解决百度小程序的模版语法问题 */
   getPathIndex: (indexOfNode: number) => string
   /** 解决支付宝小程序分包时全局作用域不一致的问题 */
@@ -252,6 +254,8 @@ export const hooks = new TaroHooks<ITaroHooks>({
 
   getLifecycle: TaroHook(HOOK_TYPE.SINGLE, (instance, lifecycle) => instance[lifecycle]),
 
+  modifyMiniLifecycle: TaroHook(HOOK_TYPE.SINGLE, (defaultConfig) => defaultConfig),
+
   getPathIndex: TaroHook(HOOK_TYPE.SINGLE, indexOfNode => `[${indexOfNode}]`),
 
   getEventCenter: TaroHook(HOOK_TYPE.SINGLE, Events => new Events()),
@@ -331,4 +335,5 @@ export const hooks = new TaroHooks<ITaroHooks>({
   initNativeApi: TaroHook(HOOK_TYPE.MULTI),
 
   patchElement: TaroHook(HOOK_TYPE.MULTI)
+
 })
diff --git a/packages/taro-alipay/src/runtime-utils.ts b/packages/taro-alipay/src/runtime-utils.ts
@@ -49,5 +49,18 @@ export const hostConfig = {
   },
   isBubbleEvents (eventName) {
     return BUBBLE_EVENTS.has(eventName)
+  },
+  modifyMiniLifecycle (componentConfig, { isCustomWrapper }) {
+    // 修改组件的生命周期配置
+    return isCustomWrapper
+      ? {
+        ...componentConfig,
+        deriveDataFromProps (nextProps) {
+          if (this.data.i !== undefined && this.props.i !== nextProps.i) {
+            this.setData({ i: nextProps.i })
+          } 
+        }
+      }
+      : componentConfig
   }
 }
diff --git a/packages/taro-runtime/src/dsl/common.ts b/packages/taro-runtime/src/dsl/common.ts
@@ -360,36 +360,31 @@ export function createRecursiveComponentConfig (componentName?: string) {
             el.ctx = null
           }
         }
-      },
-      // 支付宝渲染问题, 当页面复杂，CustomWrapper和page都有数据更新时，CustomWrapper的UI有几率出现不更新的情况
-      deriveDataFromProps (nextProps) {
-        if (this.data.i !== undefined && this.props.i !== nextProps.i) {
-          this.setData({ i: nextProps.i })
-        }
       }
     }
     : EMPTY_OBJ
 
-  return {
-    properties: {
-      i: {
-        type: Object,
-        value: {
-          [Shortcuts.NodeName]: getComponentsAlias(internalComponents)[VIEW]._num
+  return hooks.call('modifyMiniLifecycle', 
+    { 
+      properties: {
+        i: {
+          type: Object,
+          value: {
+            [Shortcuts.NodeName]: getComponentsAlias(internalComponents)[VIEW]._num
+          }
+        },
+        l: {
+          type: String,
+          value: ''
         }
       },
-      l: {
-        type: String,
-        value: ''
-      }
-    },
-    options: {
-      addGlobalClass: true,
-      virtualHost: !isCustomWrapper
-    },
-    methods: {
-      eh: eventHandler
-    },
-    ...lifeCycles
-  }
+      options: {
+        addGlobalClass: true,
+        virtualHost: !isCustomWrapper
+      },
+      methods: {
+        eh: eventHandler
+      },
+      ...lifeCycles }, { isCustomWrapper })
 }
+