swiper 里面嵌套视频不能左右切换了

分类：uni-app

uniapp

<swiper class="swiper-box" @change="siper_change"> <swiper-item v-for="(item, index) in swiperList" :key="item.id"> <image v-if='item.type==0' :src="item.img" mode="aspectFill" class="swiperImg" /> <video class="swiperImg" v-else id="myVideo" :src="item.img" autoplay muted controls

enable-progress-gesture="false"></video> </swiper-item>
</swiper>

swiperList: [{
id: "1", img: "https://vod.300hu.com/4c1f7a6atransbjngwcloud1oss/52742c37164119810258001921/v.f30.mp4?dockingId=7466be0c-07c2-4696-956b-facd82733308&storageSource=3", type: '1'
},
{id: "2", img: "/static/img/addoil.png", type: '0'}],

在app（安卓，ios都看了）开发中，如上代码，模仿淘宝那样，在商品详情里面放一个轮播组件，数据有图片有视频，当swiper的swiper-item项里面是视频的时候，swiper无法左右切换，求解决方法，感激不尽

2020-03-27 18:27 负责人:无分享

3 个回复

DCloud_heavensoft

其实video的文档里都写了，你没仔细看。这种场景，要用nvue。

旧时光 (作者)

谢谢，是我没有好好看文档，刚刚又去看了一遍，找到了大概下面相关的东西，打算晚点试试：swiper在App的vue中、百度支付宝头条QQ小程序中，不支持内嵌video、map等原生组件。在微信基础库2.4.4起和App nvue2.1.5起支持内嵌原生组件。竖向的swiper内嵌视频可实现抖音、映客等视频垂直拖动切换效果。

同时监听 change transition，开始滑动时触发transition, 放开手后，在ios平台触发顺序为 transition... change，Android/微信小程序/支付宝为 transition... change transition...

2020-03-27 19:44
soloEmperor

回复旧时光: 请问你有实现吗？是可以把video单独放在nvue的一个组件里，然后引入vue页面，还是整个商品详情页都是nvue页面

2020-06-16 14:02