dreamland/pages/dream/view/vodShort.vue

<template name="vodShort">
	<view>
		<swiper class="swiper" autoplay="false" vertical="true" interval="990000" @change="changeVod">
			<swiper-item v-for="(v, k) in item">
				
				<dever-video
				:item="v"
				:src="v.video" 
				:pic="v.pic" 
				:index="k" 
				:vid="v.id" 
				ref="video"
				>
				</dever-video>
				
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
import deverVideo from '@/lib/dever/components/video.nvue';
var play = true;
export default {
	name: "vodShort",
	props: {
		config : {
			type : Object,
			value : null
		},
		item : {
			type    : Array,
			value	: null
		},
	},
	data() {
		return {
			current_index: 0,
		};
	},
	created() {
		
	},
	mounted() {
		this.config.stop[this.config.page] = this;
	},
	methods:{
		start : function() {
			this.$refs.video[this.current_index].start();
		},
		stop : function() {
			this.$refs.video[this.current_index].stop();
		},
		changeVod : function(e)  {
			var self = this;
			self.$nextTick(()=>{
				self.stop();
				self.current_index = e.detail.current;
				self.start();
			});
					
		},
		tapMsg : function(e)  {
			console.log(5, e);
		},
		tapShare : function(e) {
			console.log(6, e);
		},
		tapLove : function(e)  {
			// item.is_dianzan
			this.item[this.current_index].is_dianzan = !this.item[this.current_index].is_dianzan;
			console.log(7, e);
		}
	},

	components:{
		deverVideo
	}
}
</script>

<style>
.swiper{
	width: 100vw;
	height: 100vh;	
	/*position: fixed;*/
	position: relative;
	top: 0;
	left: 0;
}

</style>