介绍

vue-core-video-player是一款基于vue.js的视频播放器组件

安装与使用

安装

cnpm install vue-core-video-player -S

使用

第一步：main.js引入

import VueCoreVideoPlayer from 'vue-core-video-player'
// 默认是英文
Vue.use(VueCoreVideoPlayer)
//或者
Vue.use(VueCoreVideoPlayer, {
  lang: 'zh-CN'
})

en: 英语
zh-CN: 简体中文
jp: 日本

第二步：在组件中写入

<div id="app">
  <div class="player-container">
    <vue-core-video-player src="视频文件路径.mp4"></vue-core-video-player>
  </div>
</div>

第三步：本地路径问题

外部路径：

 <vue-core-video-player src="http://img.ksbbs.com/asset/Mon_1703/05cacb4e02f9d9e.mp4">
 </vue-core-video-player>

本地路径：

不能直接./assets/1.mp4，无效的。需要使用require("...")

<template>
  <div id="app">
       <vue-core-video-player :src="url"></vue-core-video-player>
  </div>
</template>

<script>
    export default{
        data(){
            return{
                url:require("./assets/1.mp4")
            }
        }
    }
</script>

进阶使用

更多配置