uniapp播放视频实现的组件为video
1.避免同时播放
2.不可视区域停止播放视频
生命周期里有一个onPageScroll(),监听页面的滑动。
里面有一个关于uview的getRect()函数,详细看网页资料:getRect 节点布局信息 | uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架
onPageScroll() {
var that = this;
// console.log(that)
this.$u.getRect('.' + "Trailer",true).then(rect => {
console.log(rect)
let a = rect
for (let i = 0; i < a.length; i++) {
// 判断top数值 向上滑动,不可视时暂停播放
if (a[i].top <= 0) {
console.log(a[i].dataset.id)
uni.createVideoContext(a[i].dataset.id).pause()
}
// 向下滑动,不可视时暂停播放
else if (a[i].top > this.windowHeight) {
// console.log(this.windowHeight)
// console.log(a[i].dataset.id)
uni.createVideoContext(a[i].dataset.id).pause()
}
}
})
},
methods: {
Init() {
uni.getSystemInfo({
success: function(res) {
this.windowWidth = res.windowWidth;
this.windowHeight = res.windowHeight;
console.log(this.windowHeight)
},
})
},
」
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)