fix: 修复React17选中组件bug

haloworld007 · LeoYuan · commit 750d282c03a8 · 2022-04-14T16:46:00.000+08:00
diff --git a/packages/rax-simulator-renderer/src/renderer.ts b/packages/rax-simulator-renderer/src/renderer.ts
@@ -73,7 +73,10 @@ function cacheReactKey(el: Element): Element {
   if (REACT_KEY !== '') {
     return el;
   }
-  REACT_KEY = Object.keys(el).find((key) => key.startsWith('__reactInternalInstance$')) || '';
+  // react17 采用 __reactFiber 开头
+  REACT_KEY = Object.keys(el).find(
+    (key) => key.startsWith('__reactInternalInstance$') || key.startsWith('__reactFiber$'),
+  ) || '';
   if (!REACT_KEY && (el as HTMLElement).parentElement) {
     return cacheReactKey((el as HTMLElement).parentElement!);
   }
diff --git a/packages/react-simulator-renderer/src/renderer.ts b/packages/react-simulator-renderer/src/renderer.ts
@@ -530,7 +530,10 @@ function cacheReactKey(el: Element): Element {
   if (REACT_KEY !== '') {
     return el;
   }
-  REACT_KEY = Object.keys(el).find((key) => key.startsWith('__reactInternalInstance$')) || '';
+  // react17 采用 __reactFiber 开头
+  REACT_KEY = Object.keys(el).find(
+    (key) => key.startsWith('__reactInternalInstance$') || key.startsWith('__reactFiber$'),
+  ) || '';
   if (!REACT_KEY && (el as HTMLElement).parentElement) {
     return cacheReactKey((el as HTMLElement).parentElement!);
   }

Original file line number	Diff line number	Diff line change
`@@ -73,7 +73,10 @@ function cacheReactKey(el: Element): Element {`
`73`	`73`	`if (REACT_KEY !== '') {`
`74`	`74`	`return el;`
`75`	`75`	`}`
`76`		`- REACT_KEY = Object.keys(el).find((key) => key.startsWith('__reactInternalInstance$')) \|\| '';`
	`76`	`+ // react17 采用 __reactFiber 开头`
	`77`	`+ REACT_KEY = Object.keys(el).find(`
	`78`	`+ (key) => key.startsWith('__reactInternalInstance$') \|\| key.startsWith('__reactFiber$'),`
	`79`	`+ ) \|\| '';`
`77`	`80`	`if (!REACT_KEY && (el as HTMLElement).parentElement) {`
`78`	`81`	`return cacheReactKey((el as HTMLElement).parentElement!);`
`79`	`82`	`}`
Original file line number	Diff line number	Diff line change
`@@ -530,7 +530,10 @@ function cacheReactKey(el: Element): Element {`
`530`	`530`	`if (REACT_KEY !== '') {`
`531`	`531`	`return el;`
`532`	`532`	`}`
`533`		`- REACT_KEY = Object.keys(el).find((key) => key.startsWith('__reactInternalInstance$')) \|\| '';`
	`533`	`+ // react17 采用 __reactFiber 开头`
	`534`	`+ REACT_KEY = Object.keys(el).find(`
	`535`	`+ (key) => key.startsWith('__reactInternalInstance$') \|\| key.startsWith('__reactFiber$'),`
	`536`	`+ ) \|\| '';`
`534`	`537`	`if (!REACT_KEY && (el as HTMLElement).parentElement) {`
`535`	`538`	`return cacheReactKey((el as HTMLElement).parentElement!);`
`536`	`539`	`}`