微信小程序看视频发弹幕功能

1. 目录结构

 

2.wxml

<video src="cloud://cloud1-7gm9mk795e0ad905.636c-cloud1-7gm9mk795e0ad905-1310047972/digi.mp4" danmu-list="{{danmu}}" id="myVideo"></video>
<input type="text" placeholder="请输入弹幕" bindinput="getcon"/>
<button type="primary" bindtap="send">发布弹幕</button>

3.wxss

video{
  width: 750rpx;
}

4.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    danmu:[
      {
        text:'弹幕1',
        color:'blue',
        time:1
      },
      {
        text:'弹幕2',
        time:2
      }
    ],
    con:''
  },
  getcon:function(e){
    console.log(e.detail.value)
    this.setData({
      con:e.detail.value
    })
  },
  send:function(){
    this.video.sendDanmu({
      text:this.data.con,
      color:'orange'
    })
  },