更新记录

1.1.3（2021-09-11）

1.【新增】视屏回调触发副业面时间如播放中触发事件、播放结束时触发事件等

1.1.2（2021-09-04）

1.【调整】css样式调整为直接在页面中写入，去掉外部引入的方式。\r\n 2.【调整】图片 调整路径base64的路径，不使用相对路径或绝对的路径。

调整的方向：提供开发的操作简便性，不用在去额外现在相关资源文件等信息。

1.1.1（2021-08-29）

1.【修复】进度条拖动不顺滑问题 2.【新增】进度条点击事件 3.【调整】底部播放栏样式播放按钮单独上移等若干问题 4.【调整】去除锁定播放界面功能（后续可能会考虑加上） 5.【减少】减少其他若干不重要属性和功能 6.【增加】增加视频相关设置事件方法 7.【优化】视频双加的其他bug 8.说明：原来的小程序视频播放器（慎用 ，仅供学习）已经不再维护 现在在原来的基础上进行了比较大的调整。小米unturl至尊版本测试过，其他手机微测试 （微信端）。 【重要说明】 插件的样式单独提出来了成了一个css文件请注意。

平台兼容性

使用方法

1.在script中引用组件

import splayer from '../../components/shun-player/shun-player.vue'
export default {
    components: { "shun-player": splayer},
    data() {
        return {
            poster:"",
            //poster:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-f184e7c3-1912-41b2-b81f-435d1b37c7b4/1ae87107-2943-4ba6-be2b-390ca27c6260.png",//封面
            src: 'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/a876efc0-4f35-11eb-97b7-0dc4655d6e68.mp4',
            videoTitle: "自定义测试标题"
        }
    },
    onLoad() {

    },
    onReady() {
        /*设置视频初始播放时间*/
        //this.$refs.splayer.setTime(30);
    },
    methods: {
        getVideoInfo:function(){// 获取视频信息
            var abc = this.$refs.splayer.getVideoInfo();
            console.log(abc);
        },
        setvTime:function(){ //设置视频初始播放时间 单位：s
            this.$refs.splayer.setTime(30);
        },
        play:function(){//播放
            this.$refs.splayer.vPlay();
        },
        pause:function(){//暂停
            this.$refs.splayer.vPause();
        },
        setSpeed:function(){//设置播放速度
            this.$refs.splayer.setSpeed(2.0);
        },
        setSrc:function(){//设置播放路径
            this.$refs.splayer.setSrc(this.src);
        },
        setPoster:function(){//设置封面
            this.$refs.splayer.setPoster(this.poster);
        },
        setTitle:function(){//设置标题
            this.$refs.splayer.setTitle("测试设置标题");
        },
        ExecutionEvent:function(t){
            console.log(t);
        }
    }
}

2.在 template 中使用组件

<view class="">
    <shun-player :src="src" :videoTitle="videoTitle" :poster="poster" ref="splayer" ></shun-player>
    <view class="" @tap="getVideoInfo">获取视频信息</view>
    <view class="" @tap="setvTime">设置视频时间为30s</view>
    <view class="" @tap="play">播放</view>
    <view class="" @tap="pause">暂停</view>
    <view class="" @tap="setSpeed">设置播放速度 2.0</view>
    <view class="" @tap="setSrc">设置视频路径</view>
    <view class="" @tap="setPoster">设置视频封面</view>
    <view class="" @tap="setTitle">设置视频标题</view>
</view>

说明

OBJECT参数说明

OBJECT事件说明

OBJECT 回调事件说明

子组件回去父页面传递的属性props传递的响应回调的事件名进行相应回调，返回相应信息（调用父页面方法）

属性示例：
event:{
    playEvent:"ExecutionEvent",//播放触发事件 返回时间信息
    endEvent:"EndEvent" ,//播放结束回调事件
    // errorEvent:"errorEvent",//视频加载出现错误时回调事件 参数：错误信息
    // waitinEvent:"waitinEvent"//视频缓冲时触发事件
}
调用组件时需要绑定事件监听 否则不触发 示例：
<shun-player :event="event" v-on:ExecutionEvent="ExecutionEvent" v-on:endEvent="endEvent"></shun-player>