<el-upload
class="upload-demo"
ref="vidos"
:action="URL+'/api/post/file'"
:data="date"
:on-success="handleAvatarAUDIO"
:before-upload="beforeAvatarAUDIO"
:on-progress="beforeAvatarUpload"
accept=".mp4"
:on-change="AvatarAUDIO" //将用到次方法
:file-list="fileList"
>

 

   AvatarAUDIO(file, fileList){
// 此方法如果是大文件时会出现偶尔卡顿
let reader = new FileReader()
reader.readAsDataURL(file.raw)
reader.onload=()=>{
console.log(reader.result,'地址')
this.AUDIO = reader.result
}
// 第二种方法
let URL = window.URL || window.webkitURL;
this.AUDIO = URL.createObjectURL(file.raw); },

  

element-ui 上传图片或视频时,先回显在上传的更多相关文章

  1. 记录,element ui的日期选择器只有第一次回显成功

    首先是这个 <el-date-picker v-model="value1" type="daterange" range-separator=" ...

  2. vue项目中使用element ui上传图片到七牛

    1.获取token值 后台有接口调用直接返回token值 //请求后台拿七牛云token async getQiniuToken() { //token let uploadtoken = await ...

  3. AntD框架的upload组件上传图片时使用customRequest方法自定义上传行为

    本次做后台管理系统,采用的是 AntD 框架.涉及到图片的上传,用的是AntD的 upload 组件. 我在上一篇文章<AntD框架的upload组件上传图片时使用customRequest方法 ...

  4. SpringMVC上传图片总结(1)---常规方法进行图片上传,使用了MultipartFile、MultipartHttpServletRequest

    原文地址:https://blog.csdn.net/chenchunlin526/article/details/70945877 SpringMVC上传图片总结(1)---常规方法进行图片上传,使 ...

  5. SpringMVC上传图片总结(2)--- 使用百度webuploader上传组件进行上传图片

    SpringMVC上传图片总结(2)--- 使用百度webuploader上传组件进行上传图片   在上一篇文章中,我们介绍了< SpringMVC上传图片的常规上传方法 >.本文接着第一 ...

  6. 关于vue+element对ie9的兼容el-upload不支持在IE9上传

    关于vue+element对ie9的兼容el-upload不支持在IE9上传 https://lian-yue.github.io/vue-upload-component/#/zh-cn/ 解决方案 ...

  7. H5中input输入框tppe为date时赋值(回显)

    1.当时间为2013-09-05时正常显示 <input class="form-control" name="applytime" type=" ...

  8. vue项目编辑修改时批量回显数据

    selectCityServiceOne() { let sendData = { token: this.token, id: this.id } post_ajax('backStage/city ...

  9. aliyun-oss 通过redis来实现跨域上传图片到阿里 OSS并回显进度条

    public class PutObjectProgressListener implements ProgressListener {        private long bytesWritte ...

随机推荐

  1. SparkSQL 中 RDD 、DataFrame 、DataSet 三者的区别与联系

    一.SparkSQL发展: Shark是一个为spark设计的大规模数据仓库系统,它与Hive兼容      Shark建立在Hive的代码基础上,并通过将Hive的部分物理执行计划交换出来(by s ...

  2. 虚拟机中Windows激活「很抱歉,程序无法在非MBR引导分区上进行激活」

    虚拟机激活 Windows 出现如下错误提示: 很抱歉,程序无法在非MBR引导分区上进行激活 没错,是小马Oem7F7激活工具. 最后使用 KMS 激活成功,下载链接: 链接:https://pan. ...

  3. 在jsp页面中通过struts的标签<s:if>来判断选择显示控件

    <s:iterator value="#request.users" var="u"> <!-- 判断该条评论的评论人是不是查看这篇评论的用户 ...

  4. php+ajax无刷新分页原生ajax实现分页最简单完整实例-完整代码,

    展示页面:index.html <html><script> function ajax_show() { // 获取当前页 var page =1; var xhr = ne ...

  5. MongoDB的安装与简单使用

    一.安装MongoDB的步骤 注:本教程全部统一采用hadoop用户名登录Linux系统,用户名:hadoop 密码:hadoop ​ 首先,在Linux系统中打开一个终端,执行如下命令导入公共秘钥到 ...

  6. Layui 在新标签中打开页面 / 模拟点击菜单

    原文:https://blog.csdn.net/sr_www/article/details/81394365 核心代码: //在新标签页中 打开页面 function newTab(url, ti ...

  7. jQuery事件绑定与切换

    一.事件绑定 1.标准方式 1. jquery标准的绑定方式 * jq对象.事件方法(回调函数): * 注:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为. * 表单对象.submit(); ...

  8. nuxt中localstorage的替代方案

    采用异步的方式进行存储数据,更高效快速,使用localforage是你最好的选择 具体转载自博客 Heap Stack Blog(pingbook.top) Nuxt storage data in ...

  9. V8 引擎如何进行垃圾内存的回收?

    JS 语言不像 C/C++, 让程序员自己去开辟或者释放内存,而是类似Java,采用自己的一套垃圾回收算法进行自动的内存管理.作为一名资深的前端工程师,对于JS内存回收的机制是需要非常清楚, 以便于在 ...

  10. UDF——监测指定点的物理量

    Fluent版本:2019 R1 Visual Studio版本:Visual Studio 2013 其他版本应该也是适用的 算例来源于:https://confluence.cornell.edu ...