修改短视频播放处理

master
于肖磊 2026-02-10 14:21:21 +08:00
parent 55e2479ac9
commit 3fd5468ee1
2 changed files with 35 additions and 199 deletions

View File

@ -21,8 +21,14 @@
<view class="video-bg" :style="!isEmpty(video_item.poster_url) ? 'background-image: url(' + video_item.poster_url + ')' : ''"></view>
<video class="video" :src="video_item.video_url" :poster="video_item.poster_url" :id="`video_${index}`" :loop="true" :show-fullscreen-btn="false" :show-center-play-btn="false" :show-play-btn="false" :controls="true" :show-mute-btn="true" object-fit="contain" @timeupdate="handle_time_update"></video>
<view v-if="paused && current_index === index" class="play-icon">
<text></text>
<view class="pr">
<view class="play-icon-bg"></view>
<view class="pa z-i play-icon-iconfont">
<iconfont name="icon-bofang" size="120rpx" propClass="" color="#4F3E35"></iconfont>
</view>
</view>
</view>
<template v-if="!show_comment_modal">
@ -338,7 +344,18 @@
setTimeout(() => {
if (this.video_contexts[0]) { // 0
this.video_contexts[0].play();
console.log(this.video_contexts[0]);
// try {
this.video_contexts[0].play().catch(error => {
this.setData({
paused: true,
});
});
// } catch (error) {
// this.setData({
// paused: true,
// });
// }
}
}, 200);
}, 0);
@ -862,12 +879,22 @@
left: 50%;
transform: translate(-50%, -50%);
pointer-events: none;
font-size: 80rpx;
color: rgba(255, 255, 255, 0.6);
background: rgba(0, 0, 0, 0.5);
width: 120rpx;
height: 120rpx;
border-radius: 50%;
.play-icon-bg {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #fff;
width: 80rpx;
height: 80rpx;
z-index: 0;
}
.play-icon-iconfont {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
.right-actions {

View File

@ -1,191 +0,0 @@
[
{
"id": "1",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第一条视频",
"fabulous_count": 1,
"videoUrl": "http://8.146.211.120:8080/upload/douyin/e6fddef474951cc15f5aeb99219b4a91.mp4",
"poster_url": "http://8.146.211.120:8080/upload/notes/ce5082f76cc9bd82a2bd97ce8b45ea32.jpg",
"userHead": "http://8.146.211.120:8080/upload/notes/8f5ebdab07f9fb592895bd3f0f230ea9.jpg",
"comment_obj": {
"count": 2,
"list": [
{
"id": "c1",
"userHead": "http://8.146.211.120:8080/upload/notes/b11b2d741a5132b0d733a9861c9f6c7c.jpg",
"userNick": "评论员A",
"content": "这视频太酷了!",
"time": "2024-07-07 10:00:00"
},
{
"id": "c2",
"userHead": "http://8.146.211.120:8080/upload/notes/590118acb7cda2039657d464fdc285d6.jpg",
"userNick": "评论员B",
"content": "沙发!",
"time": "2024-07-07 09:30:00"
},
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/590118acb7cda2039657d464fdc285d6.jpg",
"userNick": "评论员B",
"content": "沙发!",
"time": "2024-07-07 09:30:00"
},
{
"id": "c4",
"userHead": "http://8.146.211.120:8080/upload/notes/590118acb7cda2039657d464fdc285d6.jpg",
"userNick": "评论员B",
"content": "沙发!",
"time": "2024-07-07 09:30:00"
}
]
}
},
{
"id": "2",
"isFabulous": 0,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第二条视频",
"fabulous_count": 1,
"videoUrl": "http://8.146.211.120:8080/upload/douyin/0985b0f3879c7dca9f6c1c6fb59d4a79.mp4",
"poster_url": "http://8.146.211.120:8080/upload/background/dab42015a50709f68a75306a572aaaca.jpg",
"userHead": "http://8.146.211.120:8080/upload/background/735feb718119ea7e5f206be7b4410dd6.jpg",
"comment_obj": {
"count": 0,
"list": []
}
},
{
"id": "3",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第三条视频内容",
"fabulous_count": 1,
"videoUrl": "http://8.146.211.120:8080/upload/douyin/a4832a9a37b44196b49c646db148ec65.mp4",
"poster_url": "http://8.146.211.120:8080/upload/background/8049cff58c46adf4164907fb3abe63a8.jpg",
"userHead": "http://8.146.211.120:8080/upload/notes/b11b2d741a5132b0d733a9861c9f6c7c.jpg",
"comment_obj": {
"count": 1,
"list": [
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/701eb0ea365754a9d61778a787b27a49.jpg",
"userNick": "评论员C",
"content": "有趣!",
"time": "2024-07-07 11:00:00"
}
]
}
},
{
"id": "4",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第四条视频内容",
"fabulous_count": 1,
"videoUrl": "http://shopxo.com/static/upload/video/goods/2023/08/17/1692267725487534.mp4",
"poster_url": "http://8.146.211.120:8080/upload/background/8049cff58c46adf4164907fb3abe63a8.jpg",
"userHead": "http://8.146.211.120:8080/upload/notes/b11b2d741a5132b0d733a9861c9f6c7c.jpg",
"comment_obj": {
"count": 1,
"list": [
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/701eb0ea365754a9d61778a787b27a49.jpg",
"userNick": "评论员C",
"content": "有趣!",
"time": "2024-07-07 11:00:00"
}
]
}
},
{
"id": "5",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第五条视频内容",
"fabulous_count": 1,
"videoUrl": "http://shopxo.com/static/upload/video/goods/2019/01/14/1547458876723311.mp4",
"poster_url": "",
"userHead": "",
"comment_obj": {
"count": 1,
"list": [
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/701eb0ea365754a9d61778a787b27a49.jpg",
"userNick": "评论员C",
"content": "有趣!",
"time": "2024-07-07 11:00:00"
}
]
}
},
{
"id": "6",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第六条视频内容",
"fabulous_count": 1,
"videoUrl": "http://shopxo.com/static/upload/video/goods/2023/08/17/1692267246598639.mp4",
"poster_url": "",
"userHead": "",
"comment_obj": {
"count": 1,
"list": [
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/701eb0ea365754a9d61778a787b27a49.jpg",
"userNick": "评论员C",
"content": "有趣!",
"time": "2024-07-07 11:00:00"
}
]
}
},
{
"id": "7",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第七条视频内容",
"fabulous_count": 1,
"videoUrl": "http://8.146.211.120:8080/upload/douyin/a4832a9a37b44196b49c646db148ec65.mp4",
"poster_url": "",
"userHead": "",
"comment_obj": {
"count": 1,
"list": [
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/701eb0ea365754a9d61778a787b27a49.jpg",
"userNick": "评论员C",
"content": "有趣!",
"time": "2024-07-07 11:00:00"
}
]
}
},
{
"id": "8",
"isFabulous": 1,
"userNick": "WX: MAMBA_4EVER24",
"videoContent": "第八条视频内容",
"fabulous_count": 1,
"videoUrl": "http://shopxo.com/static/upload/video/goods/2023/08/17/1692267725487534.mp4",
"poster_url": "",
"userHead": "",
"comment_obj": {
"count": 1,
"list": [
{
"id": "c3",
"userHead": "http://8.146.211.120:8080/upload/notes/701eb0ea365754a9d61778a787b27a49.jpg",
"userNick": "评论员C",
"content": "有趣!",
"time": "2024-07-07 11:00:00"
}
]
}
}
]