Z-video-player NPM

z-video-player是一个集成多方播放器的可自由选择的播放器插件。

安装

使用 npm 或 yarn 安装

我们推荐使用 npm 或 yarn 的方式进行开发，不仅可在开发环境轻松调试，也可放心地在生产环境打包部署使用，享受整个生态圈和工具链带来的诸多好处。

$ npm install z-video-player

$ yarn add z-video-player

引入

import { ZPlayer } from 'z-video-player'

引入样式

import 'z-video-player/es/ZPlayer/style/style.css'

组件示例

<script>
export default {
  components: {
    ZPlayer
  },
  data() {
    options: {
      appKey: "xxxxxxxxxxxxxxx",
      appSecret: "xxxxxxxxxxxxxxx",
      ip: "xxx.xxx.xxx.xxx",
      videoNo: "xxxxxxxxxxxxxxxxx",
      port: "xxxx",
      url: "http://您的ip:端口/xxxxxxxx",
      configId: "",
      id: "",
      coverPic: null,
      playType: "1",
      showToolbar: 1,
      name: "海康威视"
    }
  }
}
</script>

<ZPlayer ref="ZPlayer" :options="options"></ZPlayer>

参数

OPTIONS

海康威视视频 OPTIONS配置

属性	说明	类型	默认值
appKey	海康威视Key	String	""
appSecret	海康威视Secret	String	""
ip	海康威视ip	String	""
videoNo	海康威视视频编号	String	""
port	海康威视端口	String	""
url	视频实际拼接地址	String	""
configId	视频基础配置属性	String	""
id	视频基础配置属性	String	""
coverPic	视频封面	String	""
playType	视频类型	String	1
showToolbar	是否显示工具栏，0-不显示，非0-显示	String	""
name	视频名称	String	""