From 3da2a24796ce09548fda0ae8f09f7a60b3f6c308 Mon Sep 17 00:00:00 2001 From: nieyuyao Date: Tue, 9 Jul 2024 12:19:00 +0800 Subject: [PATCH 1/2] fix(v-show): determine v-show when updating styles --- src/platforms/web/runtime/modules/style.ts | 10 +++++++++- test/unit/features/directives/show.spec.ts | 17 +++++++++++++++++ 2 files changed, 26 insertions(+), 1 deletion(-) diff --git a/src/platforms/web/runtime/modules/style.ts b/src/platforms/web/runtime/modules/style.ts index 13898eabfd1..6192f1cd776 100644 --- a/src/platforms/web/runtime/modules/style.ts +++ b/src/platforms/web/runtime/modules/style.ts @@ -82,7 +82,7 @@ function updateStyle(oldVnode: VNodeWithData, vnode: VNodeWithData) { // to mutate it. vnode.data.normalizedStyle = isDef(style.__ob__) ? extend({}, style) : style - const newStyle = getStyle(vnode, true) + const newStyle = getStyle(vnode, true) as any for (name in oldStyle) { if (isUndef(newStyle[name])) { @@ -94,6 +94,14 @@ function updateStyle(oldVnode: VNodeWithData, vnode: VNodeWithData) { // ie9 setting to null has no effect, must use empty string setProp(el, name, cur == null ? '' : cur) } + // determines if `v-show` is set, it has a higher priority. + if ('__vOriginalDisplay' in el) { + setProp(el, 'display', el.__vOriginalDisplay) + const vShowDirective = data.directives?.find(d => d.name === 'show') + if (vShowDirective && !vShowDirective.value) { + setProp(el, 'display', 'none') + } + } } export default { diff --git a/test/unit/features/directives/show.spec.ts b/test/unit/features/directives/show.spec.ts index 86641b4af4f..c1f02fd477a 100644 --- a/test/unit/features/directives/show.spec.ts +++ b/test/unit/features/directives/show.spec.ts @@ -94,4 +94,21 @@ describe('Directive v-show', () => { }) .then(done) }) + + it('should prefer to use v-show to update display', done => { + const vm = new Vue({ + template: '

', + data: { display: false, count: 1, style: { display: 'block' } } + }).$mount() + expect(vm.$el.style.display).toBe('none') + vm.count++ + waitForUpdate(() => { + expect(vm.$el.style.display).toBe('none') + vm.display = true + }) + .then(() => { + expect(vm.$el.style.display).toBe('block') + }) + .then(done) + }) }) From 0f520f4debb8a803b50a40598505777ab3a6fb5b Mon Sep 17 00:00:00 2001 From: nieyuyao Date: Mon, 12 Aug 2024 22:28:09 +0800 Subject: [PATCH 2/2] chore(v-show): remove any --- src/platforms/web/runtime/modules/style.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/platforms/web/runtime/modules/style.ts b/src/platforms/web/runtime/modules/style.ts index 6192f1cd776..04bb016e334 100644 --- a/src/platforms/web/runtime/modules/style.ts +++ b/src/platforms/web/runtime/modules/style.ts @@ -82,7 +82,7 @@ function updateStyle(oldVnode: VNodeWithData, vnode: VNodeWithData) { // to mutate it. vnode.data.normalizedStyle = isDef(style.__ob__) ? extend({}, style) : style - const newStyle = getStyle(vnode, true) as any + const newStyle = getStyle(vnode, true) for (name in oldStyle) { if (isUndef(newStyle[name])) { pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy