Hbuilder-视频播放

<template>
	<view>
		<video class="video"  :src="src"
		 autoplay="true" loop="true" enable-danmu="true" danmu-btn="true" :danmu-list="danmuList">
		</video>
		<view class="title">视频集合{
   
   {name}}
			<view class="uni-list-cell" hover-class="uni-list-cell-hover"
			 v-for="(item,index) in tvList" :key="index" @tap="setUrl(item)" >
				<view class="list-cell">
					{
   
   {item.name}}
				</view>
			</view>
		</view>
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				danmuList: [],
				src:'https://v-cdn.zjol.com.cn/280443.mp4',
				name:'',
				tvList: [
					{id:'1',name: '第1集',url:'https://v-cdn.zjol.com.cn/280443.mp4'}, 
					{id:'1',name: '第2集',url:'https://v-cdn.zjol.com.cn/276982.mp4'}, 
					{id:'1',name: '第3集',url:'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4'}, 
					{id:'1',name: '第4集',url:'http://vjs.zencdn.net/v/oceans.mp4 '}, 
					{id:'1',name: '第5集',url:'http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4'}, 
				]
			}
		},
		methods: { 
			setUrl(row) {
				debugger
				console.log(">>>11>>>>>>>" + JSON.stringify(row)) 
				let{src,name}=this.$data
				src=row.url;
				this.$data.src=row.url
				this.$data.name=row.name
				console.log(">>>22>>>>>>>" + this.$data.src) 
			},
		}
	}
</script>
<style lang="scss">
	.video {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
 
	}
 
	.title {
		color: #1CBBB4;
		font-weight: normal;
		margin-left: 30rpx;
		margin-top: 10rpx;
	}
 
	.list-cell {
		color: #1CBBB4;
		float: left;
		margin-left: 20rpx;
		margin-top: 20rpx;
	}
</style>