diff --git a/packages/components/splitter/__tests__/splitter.test.tsx b/packages/components/splitter/__tests__/splitter.test.tsx
index 8e7100fc49..85496aa430 100644
--- a/packages/components/splitter/__tests__/splitter.test.tsx
+++ b/packages/components/splitter/__tests__/splitter.test.tsx
@@ -411,4 +411,24 @@ describe('Splitter', () => {
     expect(panels[0].attributes('style')).toContain('flex-basis: 150px;')
     expect(panels[1].attributes('style')).toContain('flex-basis: 250px;')
   })
+
+  it('should not still display the mask after the panel updates', async () => {
+    const show = ref(true)
+    const wrapper = mount(() => (
+      <ElSplitter onResizeStart={() => (show.value = false)}>
+        <ElSplitterPanel v-if={show.value}>Left Panel</ElSplitterPanel>
+        <ElSplitterPanel>Right Panel</ElSplitterPanel>
+      </ElSplitter>
+    ))
+    await nextTick()
+
+    expect(wrapper.find('.el-splitter__mask').exists()).toBeFalsy()
+
+    const splitBar = wrapper.find('.el-splitter-bar__dragger')
+    const mousedown = new MouseEvent('mousedown', { bubbles: true })
+    Object.defineProperty(mousedown, 'pageX', { value: 200 })
+    splitBar.element.dispatchEvent(mousedown)
+    await nextTick()
+    expect(wrapper.find('.el-splitter__mask').exists()).toBeFalsy()
+  })
 })
diff --git a/packages/components/splitter/src/splitter.vue b/packages/components/splitter/src/splitter.vue
index b0ae9a7910..e1a3b23539 100644
--- a/packages/components/splitter/src/splitter.vue
+++ b/packages/components/splitter/src/splitter.vue
@@ -37,6 +37,7 @@ const {
 } = useOrderedChildren<PanelItemState>(getCurrentInstance()!, 'ElSplitterPanel')
 
 watch(panels, () => {
+  movingIndex.value = null
   panels.value.forEach((instance: PanelItemState, index: number) => {
     instance.setIndex(index)
   })