微信小程序开发之——婚礼邀请函-美好时光页面(4

---

• 该页面采用视频的方式展示新人的难忘时光

• 视频的播放有两种方式：

• video组件

• 腾讯视频插件

三 video组件和腾讯视频插件介绍

---

3.1 video组件

组件介绍

• video组件常用于视频播放

• 默认宽度为300px，高度为225px

• 通过wxss可重新设置宽度和高度

常用属性

| 属性 | 类型 | 说明 |

| :-: | :-: | :-: |

| src | String | 视频的资源地址 |

| loop | Boolean | 是否循环播放，默认为false |

| controls | Boolean | 是否显示默认播放控件(播放/暂停按钮、播放进度、时间)，默认为true |

| danmu-list | Object | 弹幕列表 |

| danmu-btn | Boolean | 是否显示弹幕显示/隐藏按钮，只有在初始化时有效，不能动态变更，默认为false |

| enable-danmu | Boolean | 是否展示弹幕，只有初始化时有效，不能动态变更，默认为false |

| autoplay | Boolean | 是否自动播放，默认为false |

| poster | String | 视频封面的图片资源地址，如果controls属性为false则设置poster无效 |

| bindplay | EventHandle | 当开始/继续播放时触发play事件 |

| bindpause | EventHandle | 当暂停播放时触发pause事件 |

实例

布局文件

获取视频

样式文件

video{width:100vw}

input{border:1px solid #ccc;margin: 20rpx;}

逻辑文件

data: {

src:‘http://7xjmzj.com1.z0.glb.clouddn.com/20171026175005_JObCxCE2.mp4’,

danmuList:[

{text:‘第1s出现的弹幕’,color:‘#ff0000