element-ui 上传图片 后清空 图片 显示
使用element-ui组件,用el-upload上传图片,上传图片后再次打开还是会有原来的图片,想要清空原来上传的图片,只需要在组件上绑定ref,在提交成功后的方法里调用this.$refs.upload.clearFiles();就可以清除原来上传的文件。
示例:
<el-row>
<el-upload
ref='upload' //清空图片数组的
class="upload-demo"
drag
:headers="headers" //请求头
:action="action" //请求路径
:onError="uploadError" //上传失败调用的方法
:onSuccess="uploadSuccess" //上传成功调用的方法
multiple>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
</el-row> ... //执行
this.$refs.upload.clearFiles();
element-ui 上传图片 后清空 图片 显示的更多相关文章
- Element UI——本地引入iconfont不显示
前言 前面因为本地引入Element UI导致了iconfont不显示,所以只好再去Element UI官网去扒下iconfot 步骤 进入官网 组件 | Element UI F12进入控制台,找到 ...
- element清空图片显示
使用element-ui,使用el-upload上传图片,上传图片后再次打开还是会有原来的图片,想要清空原来上传的图片,只需要在组件上绑定ref,在提交成功后的方法里调用this.$refs.uplo ...
- vue+ElementUI项目中,上传控件为必填项,上传图片后清空提示信息
(ps:以下是我在项目中遇到得问题及解决方法,希望对你们有帮助.如果还有其他方法,可以留言,谢谢) 一个表单页面,使用element-ui中el-upload上传图片,此项为必填项,然后写了校验规则, ...
- Ueditor富文本编辑器--Ctrl V 粘贴后原有图片显示错误
最近负责将公司官网从静态网站改版成动态网站,方便公司推广营销人员修改增加文案,避免官网文案维护过于依赖技术人员.在做后台管理系统时用到了富文本编辑器Ueditor,因为公司有一个阿里云文件资源服务器, ...
- vue项目中使用element ui上传图片到七牛
1.获取token值 后台有接口调用直接返回token值 //请求后台拿七牛云token async getQiniuToken() { //token let uploadtoken = await ...
- element ui 上传图片
upload在form模块,在demo的基础上包个form然后action写地址用?&拼接参数即可
- Element UI系列:Upload图片自定义上传
HTML部分代码 Javascript部分代码 CSS代码 样式部分可以自由调整 主要实现的原理是利用 http-request 的属性对上传进行自定义
- vue项目在webpack打包后背景图片显示不了
加上 publicPath:'../../'即可
- html上传图片后,在页面显示上传的图片
html上传图片后,在页面显示上传的图片 1.html <form class="container" enctype="multipart/form-data&q ...
随机推荐
- php门面模式(facade pattern)
书上不全的代码,我自己补全的. <?php /* The facade pattern is used when we want to simplify the complexities of ...
- js 正则表达式 贪婪与惰性
首先引入一个介绍比较详细的网站 http://www.jb51.net/article/31491.htm 接下来是本人的简介 其实贪婪和惰性很容易理解,从字面意思我们就可以知道,所谓的"贪 ...
- MySQL 8.x 函数和操作符,官方网址:https://dev.mysql.com/doc/refman/8.0/en/functions.html
MySql 8.x 函数和操作符,官方网址:https://dev.mysql.com/doc/refman/8.0/en/functions.html
- [Inside HotSpot] Xcode编译调试OpenJDK12
编译 下载brew然后安装hg,freetype,ccache $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent. ...
- 2019牛客国庆集训派对day3 买一送一
题目链接: 题意:有n个点,n-1条单向边,每个点都销售一类商品 问从点1开始走,买第一样商品类型为x,买第二样商品类型为y,问不同有序对<x,y>的数量 解法: col[i]表示这个点的 ...
- 压缩、解压命令——gzip、gunzip、tar、zip、bzip2
1.gzip命令与gunzip命令(压缩解压文件): (1)gzip——压缩: 利用touch命令创建一个文件,并向里面写入内容: 对创建的文件进行压缩: (2)解压缩gzip -d或gunzip: ...
- Ubuntu下手动安装vscode
Ubuntu下手动安装vscode1.下载vscodewget https://vscode.cdn.azure.cn/stable/553cfb2c2205db5f15f3ee8395bbd5cf0 ...
- pycharm进行个性化设置
1. 设置主题:Monokai Ctrl+Alt+S: Editor->Color&Fonts->Python 2. 修改[选中内容]颜色 因为用了Monokai主题后,选中内容的 ...
- 第04组alpha冲刺(3/4)
队名:斗地组 组长博客:地址 作业博客:Alpha冲刺(3/4) 各组员情况 林涛(组长) 过去两天完成了哪些任务: 1.收集各个组员的进度 2.写博客 展示GitHub当日代码/文档签入记录: 接下 ...
- 【XR-4】题
题面 题解 由题,所求为方程\(y^2 = x^2 + ax + b\)的整数解数量. 两边同乘\(4\),可得\((2y)^2 = 4x^2 + 4ax + 4b\). 配方后得\((2y)^2 = ...