uniapp video 播放本地视频 ,具体的代码
时间: 2024-10-09 21:07:48 浏览: 81
uni-app-video(支持后台播放音频的视频播放器).zip
5星 · 资源好评率100%
在UniApp中,播放本地视频需要使用Video组件,并通过File API来选取本地文件。以下是一个简单的示例代码,演示如何在uniapp中播放本地视频:
```javascript
<template>
<view>
<video id="localVideoPlayer" :src="videoSrc" autoplay></video>
</view>
</template>
<script>
export default {
data() {
return {
videoSrc: null,
};
},
methods: {
selectLocalVideo() {
// 选择本地视频文件
uni.chooseFile({
success: function(res) {
let file = res.tempFilePath; // 获取到文件路径
this.videoSrc = 'file:///' + file; // 设置video的src为本地文件路径
// 开始播放
document.getElementById('localVideoPlayer').play();
}
});
},
},
created() {
// 初始化时可以先尝试加载一个默认视频,实际使用时根据需求决定是否需要
this.videoSrc = 'path/to/default/video.mp4';
},
};
</script>
```
在这个例子中,`chooseFile`函数用于让用户选择本地视频文件,选中后文件路径会被设置给`videoSrc`。注意,`src`属性使用了`file://`协议来表示本地文件。
阅读全文