更新记录
1.0.0(2022-04-15)
下载此版本
2022-01-15 首发
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
app-vue |
× |
× |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
× |
√ |
× |
× |
√ |
× |
× |
× |
× |
Reaee小视频封面提取器
reaee-video-cover-extractor
介绍:
有个上传视频前截取视频封面的需求, 找不到合适的插件, 就做了一个, 分享给大家 !
里面实现很简单,有兴趣的可以自行完善 !
示例
以下注意事项:
- 仅在H5端和华为mate30pro 上测试, 使用前烦请各位测试后再用, 热心的请把测试结果发布到评论, 以帮助他人减少测试量 !
- 此工具基于renderjs, 所以不支持nvue, 且仅支持H5和APP-PLUS
- 短期内没有更新计划,请谨慎选择
- 文件过大时会加载不出来,且影响后续加载其它视频,此BUG未解决且也不打算继续,可自行在传参前效验文件大小!
使用示例
<template>
<view>
<image :src='src' style="width: 100vw;height: 100vw;" mode="aspectFit"></image>
<reaee-video-cover-extractor :path="tempFilePath" @success='success' @error='error' />
<button @tap="select">加载视频</button>
</view>
</template>
<script>
export default {
data() {
return {
// 视频临时地址
tempFilePath: '',
// 封面图片地址
src: ''
}
},
methods: {
// 选择视频
async select() {
const o = await uni.chooseVideo()
const [a, {tempFilePath}] = o
if(tempFilePath){
this.tempFilePath = tempFilePath
}else{
this.tempFilePath = ''
}
},
// 视频封面提取成功
success(o) {
this.src = o
},
// 视频封面提取失败
error(e) {
console.log('error', e);
}
}
}
</script>