HTML video 退出全屏的事件监听

最近做了一个小需求。大概是微信H5端点击视频。然后全屏播放；功能挺简单的吧。这边用的就是html的video组件。也遇到点问题 就记录一下。
这边贴一下微信的X5内核浏览器的一些接入规范 可以看一下

视频组件

这边加了一些属性的描述--我发现有的属性介绍说是起什么作用的。但是发现并没有生效。可能是因为有的属性共同存在导致不生效吧 。具体的也没有去试了

         <video
                    ref={this.videoRef}
                    id="video"
                    src={videoUrl}//视频连接
                    controls //使用浏览器提供的播放控件；
                    autoplay={'autoplay'} //视频加载好会自己默认播放
                    poster={poster}//封面
                    webkit-playsinline="true" //这个就是下面的不同版本时间
                    playsinline='true' //当配置了这个他们都不会默认全屏了
                    style={{
                        width: 300,
                        height: 200,
                        backgroundColor: 'black',
                    }}
                    x5-video-player-fullscreen="true" //视频播放时将会进入到全屏模式
                    x5-video-player-type="h5" //x5-video-player-type 启用H5同层播放器-可以在视频上方显示html元素。
                    x5-video-orientation={'landscape'}
                />

退出全屏的方法

这边只记录微信X5内核的方法--
本来安卓的方法呢 是官方提供的 但是发现ios端并不生效 安卓端可以使用 就用了这个办法 进入全屏的我没测试 不晓得了。。

IOS：

document.getElementById('voide').addEventListener('pause', () => {
             todo 
            });

android:

document.getElementById('video').addEventListener("x5videoexitfullscreen", function(){
alert("exit fullscreen")
})
 
document.getElementById('video').addEventListener("x5videoenterfullscreen", function(){
alert("enter fullscreen")
})

如果有幸有人看了这篇文章。有好的办法 可以评价下。谢谢；
暂时就记录到这个吧。