<el-upload v-if="userType!=='stu'" accept=".png,.jpeg,.jpg" action :http-request="uploadPhoto" :file-list="fileImgList" :show-upload-list="false" list-type="picture-card" :on-preview="handlePictureCardPreview" :on-remove="handleRemove"> <i class="el-icon-plus"></i> </el-upload>去除右上角的勾号
时间: 2024-02-10 10:14:54 浏览: 152
你可以在el-upload组件中添加一个slot属性为`file`,然后在这个slot中自定义上传文件列表项的显示。这样就可以去掉右上角的勾号了。
例如:
```html
<el-upload v-if="userType!=='stu'"
accept=".png,.jpeg,.jpg"
action
:http-request="uploadPhoto"
:file-list="fileImgList"
:show-upload-list="false"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
>
<i class="el-icon-plus"></i>
<template slot="file" slot-scope="{ file }">
<div class="el-upload-list__item-thumbnail">
<img :src="file.url" alt="" />
</div>
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<i class="el-icon-zoom-in"></i>
</span>
<span class="el-upload-list__item-delete" @click="handleRemove(file)">
<i class="el-icon-delete"></i>
</span>
</span>
</template>
</el-upload>
```
在这里,我们通过添加一个`file` slot来自定义上传文件列表项的显示,其中包括一个放置图片缩略图的div和两个操作按钮:预览和删除。这样就可以去掉右上角的勾号了。
阅读全文