chore: update

Author: linzhe141

packages/runtime-core/src/component.ts

@@ -582,14 +582,9 @@ export interface ComponentInternalInstance {
    * For updating css vars on contained teleports
    * @internal
    */
-  ut?: (vars?: Record<string, string>) => void
-  /**
-   * `update nested teleport css vars`
-   * @internal
-   */
-  parentUt?: {
+  ut?: {
     uid: number
-    ut: (vars?: Record<string, string>) => void
+    update: (vars?: Record<string, string>) => void
   }[]
   /**
    * dev only. For style v-bind hydration mismatch checks

packages/runtime-core/src/components/Teleport.ts

@@ -476,23 +476,14 @@ function updateCssVars(vnode: VNode, isDisabled: boolean) {
     anchor = vnode.targetAnchor
   }
   if (ctx && ctx.ut) {
-    let currentNode = node
-    while (currentNode && currentNode !== anchor) {
-      if (currentNode.nodeType === 1)
-        currentNode.setAttribute('data-v-owner', ctx.uid)
-      currentNode = currentNode.nextSibling
-    }
-    ctx.ut()
-  }
-  if (ctx && ctx.parentUt) {
-    ctx.parentUt.forEach(i => {
+    ctx.ut.forEach(i => {
       let currentNode = node
       while (currentNode && currentNode !== anchor) {
         if (currentNode.nodeType === 1)
-          currentNode.setAttribute(`data-v-parent-${i.uid}-owner`, '')
+          currentNode.setAttribute(`data-v-owner-${i.uid}`, '')
         currentNode = currentNode.nextSibling
       }
-      i.ut()
+      i.update()
     })
   }
 }

packages/runtime-core/src/vnode.ts

@@ -491,7 +491,7 @@ function createBaseVNode(
     ctx: currentRenderingInstance,
   } as VNode
 
-  updateParentUt(vnode)
+  updateUt(vnode)
 
   if (needFullChildrenNormalization) {
     normalizeChildren(vnode, children)
@@ -539,22 +539,15 @@ function createBaseVNode(
   return vnode
 }
 
-function updateParentUt(vnode: VNode) {
-  if (vnode.ctx && vnode.ctx.parent && vnode.ctx.parent.parentUt) {
-    vnode.ctx.parentUt = vnode.ctx.parent.parentUt.slice(0)
-  }
-  if (
-    vnode.ctx &&
-    currentRenderingInstance &&
-    currentRenderingInstance.parent &&
-    currentRenderingInstance.parent.ut
-  ) {
-    const parentUid = currentRenderingInstance.parent.uid
-    const parentUt = currentRenderingInstance.parent.ut
-    if (!vnode.ctx.parentUt) {
-      vnode.ctx.parentUt = [{ ut: parentUt, uid: parentUid }]
-    } else if (!vnode.ctx.parentUt.find(i => parentUid === i.uid)) {
-      vnode.ctx.parentUt.push({ ut: parentUt, uid: parentUid })
+function updateUt(vnode: VNode) {
+  if (vnode.ctx && vnode.ctx.parent && vnode.ctx.parent.ut) {
+    const parentUt = vnode.ctx.parent.ut.slice(0)
+    if (vnode.shapeFlag & ShapeFlags.COMPONENT) {
+      if (vnode.ctx.ut) {
+        vnode.ctx.ut.unshift(...parentUt)
+      } else vnode.ctx.ut = parentUt
+    } else if (vnode.shapeFlag & ShapeFlags.TELEPORT) {
+      if (!vnode.ctx.ut) vnode.ctx.ut = parentUt
     }
   }
 }

packages/runtime-dom/src/helpers/useCssVars.ts

@@ -28,14 +28,18 @@ export function useCssVars(getter: (ctx: any) => Record<string, string>): void {
   }
   /* v8 ignore stop */
 
-  const updateTeleports = (instance.ut = (vars = getter(instance.proxy)) => {
-    Array.from(
-      document.querySelectorAll(`[data-v-owner="${instance.uid}"]`),
-    ).forEach(node => setVarsOnNode(node, vars))
-    Array.from(
-      document.querySelectorAll(`[data-v-parent-${instance.uid}-owner]`),
-    ).forEach(node => setVarsOnNode(node, vars))
-  })
+  const ut = {
+    uid: instance.uid,
+    update: (vars = getter(instance.proxy)) => {
+      Array.from(
+        document.querySelectorAll(`[data-v-owner-${instance.uid}]`),
+      ).forEach(node => setVarsOnNode(node, vars))
+    },
+  }
+  instance.ut = [ut]
+  const updateTeleports = () => {
+    instance.ut!.forEach(i => i.update())
+  }
 
   if (__DEV__) {
     instance.getCssVars = () => getter(instance.proxy)
@@ -48,7 +52,7 @@ export function useCssVars(getter: (ctx: any) => Record<string, string>): void {
     } else {
       setVarsOnVNode(instance.subTree, vars)
     }
-    updateTeleports(vars)
+    updateTeleports()
   }
 
   onBeforeMount(() => {