vue 使用video播放rtmp视频流，如何引入以及各种会出问题解决方法

一、基本引用（采用vue-video-player)[记得把网页的flash改成允许]

1.安装依赖：（1）npm install vue-video-player --save（2）npm install --save videojs-flash（切记要除了安装vue-video-playe，还需要手动安装videojs-flash，这里要注意，安装的时候要用npm，不要用cnpm）

2.在自己写监控页面引入：

import "video.js/dist/video-js.css";

import { videoPlayer } from "vue-video-player";

import "videojs-flash";

3.在template标签下需要用到播放器的位置写入播放器标签

4.在data中写入参数:（使用数据源地址："rtmp://58.200.131.2:1935/livetv/hunantv"）

 

5.

6.数据渲染调用queryVideo方法；

二、在vue+element-ui使用情况下，离开页面时，弹出错误，是因为关闭窗口没有注销video,所有引发引发下面错误：

1.

2.我的解决方法是，在离开这个页面组件，刷新页面

   

三、切换数据源

video有点击暂停与播放的事件，可以对该两个事件进行数据源切换