Bug Type:Component

Environment

• Vue Version: 3.2.33
• Element Plus Version: 2.1.10
• Browser / OS: UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.69 Safari/537.36
• Build Tool: Vite

Reproduction

dropdown-item设置disabled属性绑定的单击事件仍能执行，command则不会

Related Component

• el-dropdown-item

Reproduction Link

Element Plus Playground

Steps to reproduce

<template>
  <el-dropdown>
    <span class="el-dropdown-link">
      Dropdown List<el-icon class="el-icon--right"><arrow-down /></el-icon>
    </span>
    <template #dropdown>
      <el-dropdown-menu>      
        <el-dropdown-item   @click="handledisabledclick" disabled>disabled</el-dropdown-item>    
           <el-dropdown-item   @click="handleenabledclick" >enabled</el-dropdown-item>    
      </el-dropdown-menu>
    </template>
  </el-dropdown>
</template>

<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { ArrowDown } from '@element-plus/icons-vue'
const handledisabledclick=()=>{
ElMessage(`disabled click`)
};
const handleenabledclick=()=>{
ElMessage(`enabled click`)
}
</script>
<style scoped>
.example-showcase .el-dropdown-link {
cursor: pointer;
color: var(--el-color-primary);
display: flex;
align-items: center;
}
</style>

What is Expected?

What is actually happening?

Additional comments

• (empty)*