其他分享
首页 > 其他分享> > video 轮播视频

video 轮播视频

作者:互联网

<video controls  :src="product.videoUrl" :poster="resURL + defaultImg"></video>
//controls 显示播放器
//poster  添加封面图片
//vue
<van-swipe :autoplay="2000" :touchable="true"> <van-swipe-item v-if="product.videoUrl != ''"> <video controls :src="product.videoUrl" :poster="resURL + defaultImg"></video> </van-swipe-item> <van-swipe-item v-for="(image, index) in product" :key="index"> <img :src="image" mode="widthFix"/> </van-swipe-item> </van-swipe>
//小程序
<swiper >
                    <swiper-item v-if="videoo">
                        <video class="video" :src="videoo" bindplay="playVideo" controls="{{true}}" poster="{{resURL + defaultImg}}"></video>
   
                    </swiper-item>
                    <swiper-item v-for="(item, index) in product" :key="index">
                        
                        <image :src="item" class="slide-image" mode="widthFix" bindtap="perview(product.showPicList, resURL + item)"/>
                     
                    </swiper-item>
</swiper>

 

标签:播放器,视频,vue,轮播,poster,controls,video
来源: https://www.cnblogs.com/ll15888/p/11639827.html