技术栈:vue
项目需求:在页面上 存在一个播放器( video 标签)和多个按钮(每个按钮包含一个对象,里面存储视频源,封面等信息)。点击按钮将对应的视频展示在播放器。
BUG (仅出现于 iso 下 uc 浏览器):
- 播放时不能 inline,原因 video 标签会被 uc 劫持,进行全屏播放。
- 我在 vue 的 data 上定义了一个对象 curVideoItem 用来存储当前正在播放的数据信息。video 标签上的 src 是通过 curVideoItem 里面的 src 动态获取( vue 双向绑定)。切换视频的方法实现如下(首先将下一个要播放的视频的对象赋值给 curVideoItem, 然后在 nextTick 方法中执行 video.play()),此时会发生 bug (并非每次都出现) [
a. 播放器不会读取到下一个视频的 src,依然使用当前播放的的 src,这里我尝试使用 setTimeout 方法,延迟 1000ms 后调用 play 方法,效果得到明显改善,但是某些时刻仍会出现 bug;
b.在切换视频时经常出现缓存,例:当前视频播放到 3s,我切换其他视频后仍然从 3s 处进行播放。我在切换时设置 video.currentTime=0 也没有效果 ]
请大佬们指点一二。
不胜感激!
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
https://study.congcong.us/t/726443
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.