element-ui Upload 上传获取当前选择的视频时长
<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"
:auto-upload="vidoauto"
:on-change="AvatarAUDIO"
:file-list="fileList"
>
beforeAvatarAUDIO(file){
let url = URL.createObjectURL(file)
var audioElement = new Audio(url)
audioElement.addEventListener('loadedmetadata',function(){
let playTime = audioElement.duration; //playTime就是当前视频长度
})
}
element-ui Upload 上传获取当前选择的视频时长的更多相关文章
- 封装Vue Element的upload上传组件
本来昨天就想分享封装的这个upload组件,结果刚写了两句话,就被边上的同事给偷窥上了,于是在我全神贯注地写分享的时候他就神不知鬼不觉地突然移动到我身边,腆着脸问我在干啥呢.卧槽你妈,当场就把我吓了一 ...
- vue+element ui 的上传文件使用组件
前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...
- 基于element UI 的上传插件
为了不再重复的上传文件,做了一个统一选择文件和上传文件的 基于 element UI :http://element-cn.eleme.io 前端实现文件下载和拖拽上传 演示 用法 <uploa ...
- 使用Element的upload上传组件,不使用action属性上传
1.需要实现的效果如下图,在点击提交的时候再提交file数据,和其他数据统一上传,我把file转换成了base64的格式,可以再上传之前显示缩略图 2.代码分析 action属性值为"#&q ...
- 用阿里官网提供的plupload oss的web直传,视频上传进行前端验证它的时长,尺寸,大小等。替换上一个不需要的单个视频
accessid = '' accesskey = '' host = '' policyBase64 = '' signature = '' callbackbody = '' filename = ...
- element ui图片上传方法
<!--商品图片--> <template v-slot:product_cover> <el-upload list-type="picture-card&q ...
- vue-resource+element upload上传(遇到formData总是变为object格式)
文件上传这种业务需求很常见,但是最近用了element,仔细看了文档,按照demo写了上传,与后台传参调取接口时,控制台总是显示未获取到文件,想了又想,发现一开始思路就跑遍了... 写此博记录下遇到的 ...
- UI标签库专题四:JEECG智能开发平台 Upload(上传标签)
1. Upload(上传标签) 1.1. 參数 属性名 类型 描写叙述 是否必须 默认值 id string 上传控件唯一标示 是 null name string 控件name 是 null ...
- easy ui 异步上传文件,跨域
easy ui 跨域上传文件,代码如下: 1.html代码:(这段代码是个win窗体,我在点击上传图片按钮然后弹出一个上传图片的窗体,选择图片再进行上传,这样在form提交时,提交的参数会少一点.) ...
随机推荐
- Hadoop 学习资料
Hadoop 学习资料 网址 官方文档 https://hadoop.apache.org/docs/r1.0.4/cn/index.html 版本文档索引 http://hadoop.apache. ...
- NOIP 2002 选数
洛谷 P1036 选数 洛谷传送门 JDOJ 1297: [NOIP2002]选数 T2 JDOJ传送门 Description 已知 n 个整数 x1,x2,-,xn,以及一个整数 k(k< ...
- requirements 操作
requirements作用描述: 很多 Python 项目中经常会包含一个 requirements.txt 文件,里面内容是项目的依赖包及其对应版本号的信息列表, 即项目依赖关系清单,其作用是用来 ...
- 解决 IDEA 创建 Gradle 项目没有src目录问题
解决 IDEA 创建 Gradle 项目没有src目录问题 前几天遇到一个问题,就是使用IDEA创建gradle项目后,src目录没有自动生成出来,今天就给大家分享一下怎么解决. 1. 目录:创建的 ...
- nRF51822 看门狗和OTA (无线升级功能)的尴尬笔记
很久没有记笔记了.今天要记点东西,不然以后又忘记了. 随着时代的发展,现在的SDK已经是13.0了.蓝牙5.0也就来了.废话就少说了,记笔记吧. 两年前搞过nRF51822 的无线升级功能,那时候用的 ...
- DAVID 进行 GO/KEGG 功能富集分析
何为功能富集分析? 功能富集分析是将基因或者蛋白列表分成多个部分,即将一堆基因进行分类,而这里的分类标准往往是按照基因的功能来限定的.换句话说,就是把一个基因列表中,具有相似功能的基因放到一起,并和生 ...
- 网卡监控脚本--nagios
#!/usr/bin/python26#filename:check_traffic.py#the python script function for monitoring network tra ...
- 上传文件到新浪云Storage的方法
上传文件到新浪云Storage的方法,兼容本地服务器 if (!empty($_FILES['sharepic']['name'])){ $tmp_file = $_FILES['sharepic'] ...
- 【IntelliJ IDEA学习之七】maven专题
版本:IntelliJIDEA2018.1.4 一.maven全局设置 设置Runner 运行VM参数:-Xms128m -Xmx512m -Duser.language=zh -Dfile.enco ...
- cad.net 获取所有已经安装的cad版本信息
计算机\HKEY_LOCAL_MACHINE\SOFTWARE\Autodesk\Hardcopy var ackey = Registry.LocalMachine.OpenSubKey(@&quo ...