Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
hello uni-app x
提交
46130f6c
H
hello uni-app x
项目概览
DCloud
/
hello uni-app x
通知
5995
Star
90
Fork
162
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
18
列表
看板
标记
里程碑
合并请求
1
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
H
hello uni-app x
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
18
Issue
18
列表
看板
标记
里程碑
合并请求
1
合并请求
1
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
提交
46130f6c
编写于
8月 28, 2023
作者:
DCloud_JSON
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
修复 部分情况下竖划视频,会存在多个视频一起播放的情况
上级
40efdf7f
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
28 addition
and
12 deletion
+28
-12
pages/template/swiper-vertical-video/swiper-vertical-video.uvue
...template/swiper-vertical-video/swiper-vertical-video.uvue
+28
-12
未找到文件。
pages/template/swiper-vertical-video/swiper-vertical-video.uvue
浏览文件 @
46130f6c
...
...
@@ -7,7 +7,7 @@
<swiper-item class="swiper-item" v-for="(item,i) in visibleList" :key="i">
<video ref="video" class="video-box" objectFit="cover" :id="item._id" @loadstart="onLoadstart(i)" :src="item.src" :poster="item.poster_src" :show-center-play-btn="false" :autoplay="false" :controls="false" :loop="true" @play="onPlay(i)" @pause="onPause(i)"></video>
<view class="video-cover" @click="changeState(i)">
<image v-if="state[i] === '
onP
ause'" class="play-btn" src="/static/template/swiper-vertical-video/play.png" mode="widthFix"></image>
<image v-if="state[i] === '
p
ause'" class="play-btn" src="/static/template/swiper-vertical-video/play.png" mode="widthFix"></image>
</view>
<view class="video-info" v-if="0">
<text class="video-info-text">容器:第 {{i}} 个</text>
...
...
@@ -24,7 +24,8 @@
<script>
import { VideoNode } from "uts.sdk.modules.DCloudUniVideo";
type ListItem = { _id : string, content : string, src : string, poster_src : string }
let page : number = 0;
let page : number = 0,
currentPageIsShow : boolean = true;
export default {
components: {},
...
...
@@ -72,7 +73,7 @@
this.state.forEach((val : string, index : number) => {
if (index === current) {
this.doPlay(current)
} else
if (val === 'onPlay')
{
} else {
// 除了选中的其他已经播放的都需要停止
this.doStop(index)
console.log('index:' + index + '已被执行停止');
...
...
@@ -82,11 +83,22 @@
},
onReady() {
// 一启动完成,就播放第一个
this.doPlay(0)
},
this.doPlay(0)
},
onShow(){
currentPageIsShow = true
},
onHide() {
currentPageIsShow = false
console.log('pages-onHide');
this.doPause(this.current)
},
onUnload() {
this.doPause(this.current)
},
methods: {
changeState(index : number) {
if (this.state[index] === '
onP
lay') {
if (this.state[index] === '
p
lay') {
this.doPause(index)
} else {
this.doPlay(current)
...
...
@@ -97,7 +109,7 @@
},
doPlay(index : number) {
// console.log("doPlay video" + index,(this.$refs["video"] as VideoNode[])[0] );
(this.$refs["video"] as VideoNode[])[index].play()
(this.$refs["video"] as VideoNode[])[index].play()
},
doStop(index : number) {
(this.$refs["video"] as VideoNode[])[index].stop()
...
...
@@ -113,12 +125,16 @@
console.log("doPause video-" + index);
},
onPause(index : number) {
this.state[index] = '
onP
ause'
this.state[index] = '
p
ause'
console.log('onPause', index);
},
onPlay(index : number) {
this.state[index] = 'onPlay'
console.log('onPlay', index);
onPlay(index : number) {
if(this.current != index || !currentPageIsShow){
this.onPause(index)
}else{
this.state[index] = 'play'
console.log('onPlay', index);
}
},
getData() : ListItem[] {
let videoUrlList = [
...
...
@@ -163,7 +179,7 @@
},
complete(result) {
console.log('navigateBack complete', result.errMsg)
}
,
}
})
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录