视频组件vue-video-player的使用

1.开发环境 vue2
2.电脑系统 windows11专业版
3.在开发的过程中,我们可能会需要使用到视频的查看,下面我来分享一个视频组件vue-video-player
4.废话不多说,直接上操作:

npm i vue-video-player

5.在main.js中添加如下代码:

import VideoPlayer from 'vue-video-player'
require('video.js/dist/video-js.css')
require('vue-video-player/src/custom-theme.css')
Vue.use(VideoPlayer)
或
import VideoPlayer from 'vue-video-player';
import 'video.js/dist/video-js.css';
import 'vue-video-player/src/custom-theme.css';
Vue.use(VideoPlayer)

6.在使用的文件中添加如下代码:

6-1.配置数据:

playerOptions : {
    playbackRates: [0.7, 1.0, 1.5, 2.0], //播放速度
    autoplay: false, //如果true,浏览器准备好时开始回放。
    muted: false, // 默认情况下将会消除任何音频。
    loop: false, // 导致视频一结束就重新开始。
    preload: 'auto', // 建议浏览器在

7.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。

你可能感兴趣的:(视频组件vue-video-player的使用)