From 42396db868d34f9525ec3cc28779d10691dd5583 Mon Sep 17 00:00:00 2001
From: zhaozhongyu <zhaozhongyu@xunlei.com>
Date: Mon, 11 Oct 2021 20:29:02 +0800
Subject: [PATCH] fix(runtime-dom): fix v-show conflicts with style display
 binding

---
 packages/runtime-dom/src/directives/vShow.ts |  6 +++++-
 packages/runtime-dom/src/modules/style.ts    | 13 +++----------
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/packages/runtime-dom/src/directives/vShow.ts b/packages/runtime-dom/src/directives/vShow.ts
index ee2aff0b856..3ee3f9228b0 100644
--- a/packages/runtime-dom/src/directives/vShow.ts
+++ b/packages/runtime-dom/src/directives/vShow.ts
@@ -20,7 +20,11 @@ export const vShow: ObjectDirective<VShowElement> = {
     }
   },
   updated(el, { value, oldValue }, { transition }) {
-    if (!value === !oldValue) return
+    if (!value === !oldValue) {
+      el._vod = el.style.display === 'none' ? '' : el.style.display
+      setDisplay(el, value);
+      return;
+    }
     if (transition) {
       if (value) {
         transition.beforeEnter(el)
diff --git a/packages/runtime-dom/src/modules/style.ts b/packages/runtime-dom/src/modules/style.ts
index a9cc67ba5e2..2e16879bef5 100644
--- a/packages/runtime-dom/src/modules/style.ts
+++ b/packages/runtime-dom/src/modules/style.ts
@@ -7,18 +7,17 @@ export function patchStyle(el: Element, prev: Style, next: Style) {
   const style = (el as HTMLElement).style
   const isCssString = isString(next)
   if (next && !isCssString) {
-    for (const key in next) {
-      setStyle(style, key, next[key])
+    for (const key in (next as Record<string, string | string[]>)) {
+      setStyle(style, key, (next as Record<string, string | string[]>)[key])
     }
     if (prev && !isString(prev)) {
       for (const key in prev) {
-        if (next[key] == null) {
+        if ((next as Record<string, string | string[]>)[key] == null) {
           setStyle(style, key, '')
         }
       }
     }
   } else {
-    const currentDisplay = style.display
     if (isCssString) {
       if (prev !== next) {
         style.cssText = next as string
@@ -26,12 +25,6 @@ export function patchStyle(el: Element, prev: Style, next: Style) {
     } else if (prev) {
       el.removeAttribute('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
-    }
   }
 }