本文介绍在element-ui中如何实现上传一张图片后自动隐藏上传按钮的功能。通过绑定:class动态控制样式，并在onChange和handleRemove事件中更新状态。同时提供解决上传图片时表单验证提示不消失的两种方法：绑定v-model或使用ref清空验证。
element-ui单图上传隐藏按钮实现
在element-ui组件库中，实现上传一张图片后隐藏上传按钮的功能。
在el-upload组件内部，通过绑定:class属性来添加一个占位class。
:class="{hide:hideUpload}"
在data中定义初始值。
hideUpload: false,
limitCount:1
在onChange事件中（该事件在添加文件、上传成功和上传失败时都会被调用），执行相关逻辑。
this.hideUpload = fileList.length >= this.limitCount;
在handleRemove事件中（该事件在删除文件时被调用），执行相关逻辑。
this.hideUpload = fileList.length >= this.limitCount;
在style中，需要去掉scoped属性（或者将样式外部引入到一个独立的样式文件中），主要目的是为了能够修改element-ui自带的样式。
<style>
.hide .el-upload--picture-card {
display: none;
}
</style>上传图片时表单验证提示处理
PS：下面看下element-ui 上传图片时表单验证提示不消失
1.方法一: 表单元素上添加 v-model="list.length"；
2.添加一个ref ,之后在on-change 事件里清空表单验证
总结
以上所述是小编给大家介绍的element-ui上传一张图片后隐藏上传按钮功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！