实现短视频小程序指定到某个视频开始轮播,方案1已经解析过,这里就不多说了,不懂的可以请移步到这里查看:https://developers.weixin.qq.com/community/develop/article/doc/000c2e0afc8cc8b2a96b36d665b413
这里主要讲的是,如何进行动态加载数据问题
第一步,在获取数据列表中加个条件判断,如果超过你设置的长度就算二次获取数据,进行数据切割加到将要预览的数组里面,代码如下(主要看条件判断,这里以10个数据为例):
videoList: {
type: Array,
value: [],
observer: function observer() {
var newVal = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
if (newVal.length) {
newVal.map((item, index) => {
return item.idxKey = index + 1;
});
if (newVal.length<=10) {
this._videoListChanged(newVal);
} else { // 重点是这里的条件判断
// 防止当前数组被污染
let arr = JSON.parse(JSON.stringify(newVal));
// 去掉已有的数据
let nextArr = arr.splice(this.data.total);
this.data.nextQueue.push(...nextArr);
}
this.setData({total: newVal.length})
}
}
}
第二步,在每次滑动视频时,判断下当前视频总数和剩下视频个数,满足条件即可请求加载数据,代码如下:
// 判断总数据是否大于等于10,并且下滑剩下4个视频开始请求接口拿数据;这里大小可以根据自己需求修改
if (total>=10 && nextQueue.length < 5) {
this.triggerEvent('UpdataVideo', {});
}
就加这两步,轻松完成一个短视频,从定位到某个视频开始播放,到数据没有时进行预加载视频。
有什么问题,欢迎随时咨询。
如果视频总数是5条,播放下标设置成3,向上划不动。
滑动快,顺序就会发生错乱,其次还有滑动到最后,再上滑,会出现黑屏
你好 我是用video-swiper 安卓真机调式不能滑动 应该是video层级的问题 ,应该怎么解决
为什么上滑之后 顺序就会发生错乱
楼主~4个以上视频就开始循环播放列表,怎么不循环
你好 这边假如视频长度增加到11个 current_index设置为9 滚动到最后一个再往上滑 会出现重复加载的情况 偶尔会直接黑屏(swiper的current变成了-1)
如果有需求是在播放时可以实时点击列表跳转视频,该如何处理呢
滑动视频的时候上一个视频还在播放,不知道啥问题,还有现在video不支持同层渲染了吗,我看微视,快手的控件都没了
请教一个问题,就是你在使用video的时候报渲染层错误是怎么解决的?
不用轮播那直接写video显示就行,不用写这么麻烦