diff --git a/packages/components/dialog/src/use-dialog.ts b/packages/components/dialog/src/use-dialog.ts
index 2763f556f0..961a9e9aae 100644
--- a/packages/components/dialog/src/use-dialog.ts
+++ b/packages/components/dialog/src/use-dialog.ts
@@ -8,6 +8,7 @@ import {
 } from 'vue'
 import { useTimeoutFn } from '@vueuse/core'
 
+import { isUndefined } from 'lodash'
 import {
   defaultNamespace,
   useId,
@@ -35,7 +36,7 @@ export const useDialog = (
   const visible = ref(false)
   const closed = ref(false)
   const rendered = ref(false) // when desctroyOnClose is true, we initialize it as false vise versa
-  const zIndex = ref(props.zIndex || nextZIndex())
+  const zIndex = ref(props.zIndex ?? nextZIndex())
 
   let openTimer: (() => void) | undefined = undefined
   let closeTimer: (() => void) | undefined = undefined
@@ -161,7 +162,7 @@ export const useDialog = (
         closed.value = false
         open()
         rendered.value = true // enables lazy rendering
-        zIndex.value = props.zIndex ? zIndex.value++ : nextZIndex()
+        zIndex.value = isUndefined(props.zIndex) ? nextZIndex() : zIndex.value++
         // this.$el.addEventListener('scroll', this.updatePopper)
         nextTick(() => {
           emit('open')