elementui中上传组件删除时闪动问题处理
时间: 2024-02-24 18:54:45 浏览: 121
如果在 ElementUI 中使用上传组件删除文件时出现了闪动问题,可以通过以下方法解决:
1. 设置 transition-group 的 name 属性
在使用上传组件时,可以在 `el-upload-list` 组件外层添加一个 `transition-group` 组件,并为其设置 `name` 属性,如下所示:
```
<transition-group name="file-list" tag="ul">
<el-upload-list
// 其他配置项
></el-upload-list>
</transition-group>
```
然后在样式文件中添加如下代码:
```
.file-list-enter-active,
.file-list-leave-active {
transition: opacity .2s;
}
.file-list-enter,
.file-list-leave-to {
opacity: 0;
}
```
这样就可以为删除文件时的过渡添加渐隐效果,避免出现闪动问题。
2. 禁用 transition-group 的动画效果
如果您不需要为删除文件时添加过渡动画效果,可以直接禁用 `transition-group` 组件的动画效果,如下所示:
```
<transition-group name="file-list" tag="ul" :css="false">
<el-upload-list
// 其他配置项
></el-upload-list>
</transition-group>
```
这样就可以禁用 `transition-group` 组件的过渡效果,避免出现闪动问题。
阅读全文