From 97e8900de81df1213ad885fb4b6e9cae1ea5dd7e Mon Sep 17 00:00:00 2001
From: fxy060608 <fxy060608@gmail.com>
Date: Tue, 10 May 2022 12:29:35 +0800
Subject: [PATCH] fix(h5): Vue.js devtools (#3492)

---
 packages/uni-h5-vue/dist/vue.runtime.cjs.js  | 7 ++++---
 packages/uni-h5-vue/dist/vue.runtime.esm.js  | 7 ++++---
 packages/uni-h5/src/framework/setup/index.ts | 5 ++++-
 3 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/packages/uni-h5-vue/dist/vue.runtime.cjs.js b/packages/uni-h5-vue/dist/vue.runtime.cjs.js
index a81fc6e93..64f012310 100644
--- a/packages/uni-h5-vue/dist/vue.runtime.cjs.js
+++ b/packages/uni-h5-vue/dist/vue.runtime.cjs.js
@@ -3927,13 +3927,13 @@ function resetHookState(hooks) {
 function injectHook(type, hook, target = currentInstance, prepend = false) {
     if (target) {
         // fixed by xxxxxx
-        if (uniShared.isRootHook(type)) {
+        if (uniShared.isRootHook(type) && target.$pageInstance) {
             // 系统保留组件，如 view,app 等
             if (target.type.__reserved) {
                 return;
             }
-            if (target !== target.root) {
-                target = target.root;
+            if (target !== target.$pageInstance) {
+                target = target.$pageInstance;
                 if (uniShared.isRootImmediateHook(type)) {
                     // 作用域应该是组件还是页面？目前绑定的是页面
                     const proxy = target.proxy;
@@ -8252,6 +8252,7 @@ function createComponentInstance(vnode, parent, suspense) {
     }
     instance.root = parent ? parent.root : instance;
     instance.emit = emit$1.bind(null, instance);
+    instance.$pageInstance = parent && parent.$pageInstance;
     // apply custom element special handling
     if (vnode.ce) {
         vnode.ce(instance);
diff --git a/packages/uni-h5-vue/dist/vue.runtime.esm.js b/packages/uni-h5-vue/dist/vue.runtime.esm.js
index 9c9bf35e7..8887c2754 100644
--- a/packages/uni-h5-vue/dist/vue.runtime.esm.js
+++ b/packages/uni-h5-vue/dist/vue.runtime.esm.js
@@ -3954,13 +3954,13 @@ function resetHookState(hooks) {
 function injectHook(type, hook, target = currentInstance, prepend = false) {
     if (target) {
         // fixed by xxxxxx
-        if (isRootHook(type)) {
+        if (isRootHook(type) && target.$pageInstance) {
             // 系统保留组件，如 view,app 等
             if (target.type.__reserved) {
                 return;
             }
-            if (target !== target.root) {
-                target = target.root;
+            if (target !== target.$pageInstance) {
+                target = target.$pageInstance;
                 if (isRootImmediateHook(type)) {
                     // 作用域应该是组件还是页面？目前绑定的是页面
                     const proxy = target.proxy;
@@ -8349,6 +8349,7 @@ function createComponentInstance(vnode, parent, suspense) {
     }
     instance.root = parent ? parent.root : instance;
     instance.emit = emit$1.bind(null, instance);
+    instance.$pageInstance = parent && parent.$pageInstance;
     // apply custom element special handling
     if (vnode.ce) {
         vnode.ce(instance);
diff --git a/packages/uni-h5/src/framework/setup/index.ts b/packages/uni-h5/src/framework/setup/index.ts
index d253849c1..4a814ddf4 100644
--- a/packages/uni-h5/src/framework/setup/index.ts
+++ b/packages/uni-h5/src/framework/setup/index.ts
@@ -85,7 +85,10 @@ export function setupPage(comp: any) {
     clone: true, // 页面组件可能会被其他地方手动引用，比如 windows 等，需要 clone 一份新的作为页面组件
     init: initPage,
     setup(instance) {
-      instance.root = instance // 组件 root 指向页面
+      // instance.root = instance // 组件 root 指向页面
+      // 修改 root 会影响 vue devtools
+      instance.$pageInstance = instance // 组件 $pageInstance 指向页面
+      // 组件的 $pageInstance 赋值，是在 vue 内核 createComponentInstance 中 root 赋值的地方实现
       const route = usePageRoute()
       // 存储参数，让 initHooks 中执行 onLoad 时，可以访问到
       const query = decodedQuery(route.query)
-- 
GitLab