小程序一个
page里面不要放两个video组件。——鲁迅
video是算是小程序中坑最多、最深的组件之一。在早期的小程序版本库中，一个page中如果放2个video组件的话会带来很多的麻烦。如果想像原生应用那样“纵享丝滑”般滑动、切换视频，几乎是不可能的。所以我们可以用一些替代的方案来实现。
这里我是用图片来做滑动；视频固定，直接切换播放src。效果大致如下（如有侵权，告知删除）：
效果图是这样的，那如何来实现呢，主要要解决什么问题？
- 滑动手势：简单的滑动识别
- 滑动动画：在小程序中滑动视频组件不是个明智的选择
- 切换视频：直接切换
video组件的src即可，但是会有闪
解决了上面三个问题，就可以实现了小程序版抖音。大致思路如下：
因为小程序中video组件是原生组件，它是高于其他非原生组件的。只能用一个video组件，所以可以考虑这样做：我们把视频列表称为videos，把videos的poster作为背景图一张一张铺开，如下所示。然后把唯一一个video组件，将其位置固定于页面视窗中。因为小程序video组件高于其他组件，所以正常我们只能看到视频video1（盖在image1之上）。
当我们手机向上滑动，此时需要小程序的wx.createAnimation来控制底部的images滑动，制造滑动动画。当然，我们需要控制video，让其隐藏，所以就可以看到背景图片向上滑动的动画。等到滑动的同时，我们切换video的src，由video1切换到video2，image2也正是video2的poster，然后video2进行播放，此时此刻就仿佛在抖音上的彼时彼刻，切换完成。
所以，最终流程如下：
如上所述，我们在小程序中用背景图平移动画来模拟视频的切换动画。我能想到的小程序实现视频滑动切换的方案就是这样子，如果有其他想法，欢迎指出。
代码🔗 github.com/xunuo0x/vis… 欢迎指出问题，欢迎💗
