mirror of https://github.com/vuejs/core.git
fix(runtime-dom): add name to vShow for prop mismatch check (#13806)
close #13805 re-fix #13744 revert #13777 The implementation in #13777 requires users to configure __FEATURE_PROD_HYDRATION_MISMATCH_DETAILS__, otherwise errors like #13805 will occur.
This commit is contained in:
parent
0f916d8c39
commit
1031e8de08
|
@ -9,7 +9,9 @@ export interface VShowElement extends HTMLElement {
|
||||||
[vShowHidden]: boolean
|
[vShowHidden]: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export const vShow: ObjectDirective<VShowElement> & { name?: 'show' } = {
|
export const vShow: ObjectDirective<VShowElement> & { name: 'show' } = {
|
||||||
|
// used for prop mismatch check during hydration
|
||||||
|
name: 'show',
|
||||||
beforeMount(el, { value }, { transition }) {
|
beforeMount(el, { value }, { transition }) {
|
||||||
el[vShowOriginalDisplay] =
|
el[vShowOriginalDisplay] =
|
||||||
el.style.display === 'none' ? '' : el.style.display
|
el.style.display === 'none' ? '' : el.style.display
|
||||||
|
@ -45,10 +47,6 @@ export const vShow: ObjectDirective<VShowElement> & { name?: 'show' } = {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
if (__DEV__ || __FEATURE_PROD_HYDRATION_MISMATCH_DETAILS__) {
|
|
||||||
vShow.name = 'show'
|
|
||||||
}
|
|
||||||
|
|
||||||
function setDisplay(el: VShowElement, value: unknown): void {
|
function setDisplay(el: VShowElement, value: unknown): void {
|
||||||
el.style.display = value ? el[vShowOriginalDisplay] : 'none'
|
el.style.display = value ? el[vShowOriginalDisplay] : 'none'
|
||||||
el[vShowHidden] = !value
|
el[vShowHidden] = !value
|
||||||
|
|
Loading…
Reference in New Issue