hz/learning-system-mobile
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-mobile.git synced 2025-12-10 19:36:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

视频播放组件

Browse Source
This commit is contained in:
daihh
2022-11-18 16:21:16 +08:00
parent 9ea597a715
commit 0cac363df4
3 changed files with 131 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
pages/study/videoTest.vue
View File

@@ -1,6 +1,6 @@
<template>
<view>
<view>
<view v-if="show">
<video-player
:url="fileUrl"
:name="title"
@@ -8,14 +8,22 @@
:drag="true"
@play="videoPlay"
@pause="videoPause"
@playing="videoPlaying"
@timeupdate="videoPlaying"
@ended="videoEnd"
@fullscreenchange="videoScreen">
</video-player>
</view>
<!-- <view style="padding-top: 30px;display: flex;justify-content: center;">
<button type="primary" @click="changeSrc">切换测试</button>
</view> -->
<view style="padding-top: 30px;display: flex;justify-content: center;">
<button type="default" @click="loadVideo()">加载</button>
<button type="primary" @click="changeSrc()">切换测试</button>
</view>
<view>
<video style="width: 100%;"
:src="fileUrl"
:controls="true"
@fullscreenchange="videoScreen"
></video>
</view>
</view>
</template>
@@ -23,25 +31,28 @@
export default{
data(){
return {
fileUrl:'/static/temp/test.mp4',
initTime:20,
title:'测试播放',
show:false,
fileUrl:'',
initTime:0,
title:'',
author:'',
}
},
mounted() {
//this.startAudioPlay();
this.loadVideo();
},
methods:{
startAudioPlay(){
this.fileUrl='http://localhost:9090/cdn/upload/course/2022/5/979321410778959872.mp3';
loadVideo(){
//this.fileUrl='http://localhost:9090/cdn/upload/course/2022/5/979321410778959872.mp3';
this.fileUrl='/static/temp/test.mp4';
this.title='标题内容111';
this.author='作者信息';
this.initTime=40;
this.show=true;
},
changeSrc(){
this.fileUrl='http://localhost:9090/cdn/upload/course/2022/4/964853684964700160.mp3';
this.title='标题内容22';
this.author='作者信息';
this.fileUrl='/static/temp/video.mp4';
this.title='标题内容221';
this.initTime=20
},
videoPlay(){
console.log('videoPlay');