element ui图片上传方法
<!--商品图片-->
<template v-slot:product_cover>
<el-upload
list-type="picture-card"
name="cover"
accept="image/png, image/jpeg,image/jpg"
:multiple="multiple"
:action="cover_upload_action"
:headers="upload_header"
:on-success="cover_upload_success"
:on-progress="cover_on_process"
:file-list="cover"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:limit="6"
:on-exceed='on_exceed'>
<i class="el-icon-plus">添加主图</i>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog> </template>
cover_upload_success(resp, file, fileList){
console.log(fileList)
let is_last = true;
fileList.forEach(function(val, index){
if(typeof val.response == "undefined" && !val.hasOwnProperty('img_id')){
is_last = false;
}
})
if(is_last){
fileList.forEach(function(val){
if(typeof val.response != "undefined")
{
store.commit('product/PUSH_COVER',val.response.data);
}
})
}
},
element ui图片上传方法的更多相关文章
- 富文本vue-quill-editor修改图片上传方法
富文本vue-quill-editor修改图片上传方法 HTML 代码 HTML codes <!-- 上传的组件 --> <upload style="display:n ...
- selenium 图片上传方法。
找到图片上传的input标签: 直接使用send_keys()传值 browser.find_element_by_class_name("upload-pic").send_ke ...
- elment ui 图片上传遇到的一些问题
图片上传返回200,message显示请上传图片 注意上图中的name字段要和服务器接受的name相同,这里我们是imgfile,默认name不是这个,所以要在el-upload组件上设置name属性 ...
- vue+element ui 的上传文件使用组件
前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...
- 基于element UI 的上传插件
为了不再重复的上传文件,做了一个统一选择文件和上传文件的 基于 element UI :http://element-cn.eleme.io 前端实现文件下载和拖拽上传 演示 用法 <uploa ...
- 项目中使用的图片上传方法,base64存本地
//生成健康报告 public function uploadJkbg(Request $r) { $data = $r->all(); $jkbg['jkbg_ctime'] = time() ...
- js实现图片上传方法
知识点 onchange事件 循环 封装函数 ajax php Javascript代码 //找到元素 var file=document.getElementById("file" ...
- SpringBoot图片上传(三)——调用文件上传项目的方法(同时启动两个项目)
简单说明:图片上传有一个专门的工程A,提供了图片的上传和下载预览,工程B涉及到图片上传以及回显,都是调用的工程A的方法,言外之意就是要同时启动两个项目. 代码: //工程B的html代码 <di ...
- Thinkphp5+plupload图片上传功能,支持实时预览图片。
今天和大家分享一个国外的图片上传插件,这个插件支持分片上传大文件.其中著名的七牛云平台的jssdk就使用了puupload插件,可见这个插件还是相当牛叉的. 这个插件不仅仅支持图片上传,还支持大多数文 ...
随机推荐
- Browser Events 常用浏览器事件
事件 说明 click 鼠标点击时触发此事件 dblclick 鼠标双击时触发此事件 mousedown 按下鼠标时触发此事件 mouseup 鼠标按下后松开鼠标时触发此事件 mouseover 当鼠 ...
- x86-1-32位x86 处理器编程架构
x86(32位)-1-32位x86 处理器编程架构 Intel 32 位处理器架构简称IA-32(Intel Architecture,32-bit) x86是指intel的86系列的CPU统称,比如 ...
- PostgreSQL数据库安装Version10.5
PostgreSQL数据库安装,基于版本10.5安装, 在Linux系统上使用*.gz二进制压缩包手动安装. 操作系统:Red Hat Enterprise Linux Server release ...
- Swoole 中使用异步任务
执行异步任务 (Task) # server.php $serv = new Swoole\Server("127.0.0.1", 9501); // 设置异步任务的工作进程数量 ...
- PPT制作手机手指滑动效果
原文链接:https://www.toutiao.com/i6495304998786695694/ 上一节我们完成了手机滑动粗糙效果,这部分我们将给动画添加一个手指的图片. 首先,选择"插 ...
- Python面向对象时最常见的3类方法
为了节省读友的时间,先上结论(对于过程和细节感兴趣的读友可以继续往下阅读,一探究竟): [结论] 类中定义的方法类型 关键词 本质含义 如何定义 如何调用 使用场景举例 实例方法 一般无任何修饰时,默 ...
- vue部署服务器以及解决部署到apache路由出现404
最近在开发cms的时候使用Vue.js框架,利用vue-route.vue-cli结合webpack编写了一个单页路由项目,自己在服务器端配置apache.部署完成后,访问没问题,从页面中点击跳转就会 ...
- Elasticsearch基础知识学习
概要 ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基于RESTful web接口.Elasticsearch是用Java开发的,并作为Ap ...
- HTTP协议层面绕过WAF
最近也是在一直看过waf相关的资料,本次主要是想写写HTTP协议层面过WAF的一些技巧,来与大家一同探讨 原理 给服务器发送payload数据包,使得waf无法识别出payload,当apache,t ...
- JS里默认和常用转换
* { font-family: PingFang, Monaco } JS里的六大简单数据类型 string 字符类型 number 数字类型 boolean 布尔类型 symbol ES6语法新增 ...