el-dropdown组件相关总结

el-dropdown组件相关总结

• • [一、el-dropdown-menus上使用v-if，触发`Cannot read properties of null (reading 'disabled')at VueComponent.hide (index.js:1:126950)`](#一、el-dropdown-menus上使用v-if，触发Cannot read properties of null (reading 'disabled')at VueComponent.hide (index.js:1:126950))
  • • 1、解决方案
    • 2、分析

一、el-dropdown-menus上使用v-if，触发Cannot read properties of null (reading 'disabled')at VueComponent.hide (index.js:1:126950)

1、解决方案

v-if替换为v-show

2、分析

Element UI 的 el-dropdown 内部逻辑

• el-dropdown-menu 在渲染时会检查父组件（el-dropdown）的 disabled 状态
• 当el-dropdown-menu使用 v-if="false" 时，el-dropdown-menu 的 DOM 被销毁，但某些事件监听器（如点击外部关闭菜单）可能未被完全移除，后续触发事件时尝试访问已销毁组件的 disabled 属性，导致报错。