如何移除el-upload组件的关闭图标？

你提供的CSS方案有效性验证 #

你的代码：

.el-upload-list__item:hover .el-icon-close { display: none !important; }

这个方案仅能隐藏鼠标悬停在上传项上时的关闭图标，默认状态下（未hover）关闭图标依然会显示，无法实现完全移除关闭图标的需求，属于部分有效。

完全移除关闭图标的解决办法 #

1. 全局样式覆盖（最简单直接） #

如果要彻底隐藏所有状态下的关闭图标，直接去掉:hover伪类即可：

.el-upload-list__item .el-icon-close {
  display: none !important;
}

如果你的样式是Vue组件内的scoped样式，需要添加深度选择器（Vue2用/deep/，Vue3用::v-deep）：

/* Vue2 scoped样式 */
/deep/ .el-upload-list__item .el-icon-close {
  display: none !important;
}

/* Vue3 scoped样式 */
::v-deep .el-upload-list__item .el-icon-close {
  display: none !important;
}

2. 针对特定类型的上传列表精确隐藏 #

如果只需要隐藏特定list-type（比如picture或picture-card）的上传项关闭图标，可以缩小选择器范围：

/* 仅隐藏图片类型上传列表的关闭图标 */
.el-upload-list--picture .el-upload-list__item .el-icon-close,
.el-upload-list--picture-card .el-upload-list__item .el-icon-close {
  display: none !important;
}

3. 通过组件逻辑禁用删除（进阶） #

如果不仅要隐藏图标，还要彻底禁用删除功能，可以结合before-remove钩子阻止删除操作：

<el-upload
  :before-remove="handleBeforeRemove"
  <!-- 其他属性 -->
>
  <!-- 上传按钮 -->
</el-upload>

// Vue方法
handleBeforeRemove() {
  // 直接返回false阻止删除
  return false;
}

这种方式可以在隐藏图标的同时，防止用户通过其他方式（比如键盘操作）触发删除。

内容的提问来源于stack exchange，提问作者uuddya