fix: fix the leaf hoc component fails to monitor Node changes, and modify the logic for get node

liujuping · LeoYuan · commit f40017282590 · 2022-09-21T16:20:19.000+08:00
diff --git a/packages/rax-simulator-renderer/src/renderer.ts b/packages/rax-simulator-renderer/src/renderer.ts
@@ -538,6 +538,7 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
             // mock _leaf，减少性能开销
             const _leaf = {
               isEmpty: () => false,
+              isMock: true,
             };
             viewProps._leaf = _leaf;
             return createElement(Comp, viewProps, children);
diff --git a/packages/react-simulator-renderer/src/renderer.ts b/packages/react-simulator-renderer/src/renderer.ts
@@ -465,6 +465,7 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
             // mock _leaf，减少性能开销
             const _leaf = {
               isEmpty: () => false,
+              isMock: true,
             };
             viewProps._leaf = _leaf;
             return createElement(Comp, viewProps, children);
diff --git a/packages/renderer-core/package.json b/packages/renderer-core/package.json
@@ -32,6 +32,7 @@
   },
   "devDependencies": {
     "@alib/build-scripts": "^0.1.18",
+    "@alifd/next": "^1.26.0",
     "@alilc/lowcode-designer": "1.0.14",
     "@alilc/lowcode-test-mate": "^1.0.1",
     "@babel/plugin-transform-typescript": "^7.16.8",
diff --git a/packages/renderer-core/src/hoc/leaf.tsx b/packages/renderer-core/src/hoc/leaf.tsx
@@ -514,7 +514,12 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
     }
 
     get leaf(): Node | undefined {
-      return this.props._leaf || getNode?.(componentCacheId);
+      if (this.props._leaf?.isMock) {
+        // 低代码组件作为一个整体更新，其内部的组件不需要监听相关事件
+        return undefined;
+      }
+
+      return getNode?.(componentCacheId);
     }
 
     render() {
diff --git a/packages/renderer-core/tests/hoc/leaf.test.tsx b/packages/renderer-core/tests/hoc/leaf.test.tsx
@@ -232,6 +232,9 @@ describe('mini unit render', () => {
       parent: MiniRenderDivNode,
     });
 
+    nodeMap.set(miniRenderSchema.id, MiniRenderDivNode);
+    nodeMap.set(textSchema.id, TextNode);
+
     component = renderer.create(
       // @ts-ignore
       <MiniRenderDiv _leaf={MiniRenderDivNode}>
@@ -277,6 +280,8 @@ describe('mini unit render', () => {
       }),
     });
 
+    nodeMap.set(textSchema.id, TextNode);
+
     renderer.create(
       // @ts-ignore
       <div>
@@ -319,6 +324,8 @@ describe('mini unit render', () => {
       isRoot: true,
     });
 
+    nodeMap.set(textSchema.id, TextNode);
+
     const component = renderer.create(
       <Text _leaf={TextNode} content="content"></Text>
     );
@@ -351,6 +358,8 @@ describe('mini unit render', () => {
       })
     });
 
+    nodeMap.set(textSchema.id, TextNode);
+
     const component = renderer.create(
       <Text _leaf={TextNode} content="content"></Text>
     );
@@ -370,7 +379,9 @@ describe('mini unit render', () => {
   });
 
   it('parent is a mock leaf', () => {
-    const MiniRenderDivNode = {};
+    const MiniRenderDivNode = {
+      isMock: true,
+    };
 
     const component = renderer.create(
       // @ts-ignore
@@ -409,6 +420,9 @@ describe('mini unit render', () => {
       hasLoop: true,
     });
 
+    nodeMap.set(textSchema.id, TextNode);
+    nodeMap.set(miniRenderSchema.id, MiniRenderDivNode);
+
     component = renderer.create(
       // @ts-ignore
       <MiniRenderDiv _leaf={MiniRenderDivNode}>

Original file line number	Diff line number	Diff line change
`@@ -514,7 +514,12 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {`
`514`	`514`	`}`
`515`	`515`
`516`	`516`	`get leaf(): Node \| undefined {`
`517`		`- return this.props._leaf \|\| getNode?.(componentCacheId);`
	`517`	`+ if (this.props._leaf?.isMock) {`
	`518`	`+ // 低代码组件作为一个整体更新，其内部的组件不需要监听相关事件`
	`519`	`+ return undefined;`
	`520`	`+ }`
	`521`	`+`
	`522`	`+ return getNode?.(componentCacheId);`
`518`	`523`	`}`
`519`	`524`
`520`	`525`	`render() {`