fix(runtime-dom): style patching shoud always preserve v-show display property

close #4424

diff --git a/packages/runtime-dom/src/modules/style.ts b/packages/runtime-dom/src/modules/style.ts
index 1084e5b2f8f623cae25a5abc7a7308074cf8660e..69a608795d972754a78b1b97b8befb65b438725e 100644 (file)
--- a/packages/runtime-dom/src/modules/style.ts
+++ b/packages/runtime-dom/src/modules/style.ts
@@ -5,18 +5,12 @@ type Style = string | Record<string, string | string[]> | null
 
 export function patchStyle(el: Element, prev: Style, next: Style) {
   const style = (el as HTMLElement).style
+  const currentDisplay = style.display
   if (!next) {
     el.removeAttribute('style')
   } else if (isString(next)) {
     if (prev !== next) {
-      const current = style.display
       style.cssText = next
-      // indicates that the `display` of the element is controlled by `v-show`,
-      // so we always keep the current `display` value regardless of the `style` value,
-      // thus handing over control to `v-show`.
-      if ('_vod' in el) {
-        style.display = current
-      }
     }
   } else {
     for (const key in next) {
@@ -30,6 +24,12 @@ export function patchStyle(el: Element, prev: Style, next: Style) {
       }
     }
   }
+  // indicates that the `display` of the element is controlled by `v-show`,
+  // so we always keep the current `display` value regardless of the `style` value,
+  // thus handing over control to `v-show`.
+  if ('_vod' in el) {
+    style.display = currentDisplay
+  }
 }
 
 const importantRE = /\s*!important$/