3.视频播放器(midea-video)

APP内置组件，可直接在template中使用，不需要import导入和注册 。

实例

基础用法

<template>
    <midea-video class="video"
        :src="src"
        @disappear="handelDisappear"
        auto-play
        controls
        :play-status="palyStatus"
        @start="onstart"
        @pause="onpause"
        @finish="onfinish"
        @fail="onfail"
        :videoCover='videoCover'
        :enterFullscreen="true"
    >
    </midea-video>
</template>
<script>
export default {
    data() {
        return {
            src:'https://cn-res.midea.com/content/dam/mideacn-aem/homepage/Midea_Animation_Mobile%20(1).mp4',
            palyStatus:'play',
            videoCover:'./assets/image/midea-video.png'
        }
    },
    methods:{
        // 开始播放回调
        onstart(){},
        // 暂停的回调
        onpause(){},
        // 播完的回调
        onfinish(){},
        // 播放失败
        onfail(){},
        //视频出现在可视区域
        handelDisappear(){}
    }
}
</script>

Attributes

Prop	Type	Required	Default	Description
src	String	Y	-	视频播放地址
autoplay	Boolean	Y	false	进入页面后是否自动播放视频
muted	Boolean	N	false	是否静音播放
controls	Boolean	N	false	是否显示控制层
loop	Boolean	N	false	是否循环播放
isShowFullScreenBtn	Boolean	N	false	是否显示全屏按钮（默认显示）
hideNetTips	Boolean	N	false	是否显示网络状态提示、加载失败提示灯 默认显示
angle	Number	N	0	设置视频旋转角度
cache	boolean	N	false	视频是否需要缓存
videoCover	String	N	-	IOS默认可以显示第一帧，Android需要传入一张图片作为第一帧默认显示
enterFullscreen	boolean	N	false	点击视频是否全屏播放smarthome 3.14支持属性
progressColor	string	N	''	加载进度的颜色 smarthome3.14支持属性

Events

事件名称	说明	回调参数
start	视频开始播放时触发	-
pause	视频暂停播放时触发	-
finish	视频播放完毕时触发	-
fail	视频播放失败时触发	-
readyToPlay	视频资源加载成功后触发	-
videoClick	点击视频时触发	-