清晰度源插件
videojs选择不同清晰度源插件(videojs6)
何时使用
- 切换不同清晰度的时候
浏览器支持
IE 9+
安装
npm install videojs-resolution-video --save
运行
# 默认开启服务器,地址为 :http://local:8000/ # 能在ie9+下浏览本站,修改代码后自动重新构建,且能在ie10+运行热更新,页面会自动刷新 npm run start # 构建生产环境静态文件,用于发布文档 npm run site
代码演示
基本
选择清晰度
import videojs from 'video.js'import 'video.js/dist/video-js.css'import 'videojs-resolution-switcher-for-videojs6'import 'videojs-resolution-switcher-for-videojs6/lib/style' Component { const node = ReactDOM if !node return const videoJsOptions = controls: true plugins: videoJsResolutionSwitcher: default: 360 dynamicLabel: true ui:true // react0.14.x data-reactid问题 const videoEl = document videoElclassName = `video-js` node thisplayer = } { if thisplayer thisplayer } { player; player } { return <div = /> } ReactDOM;
API
代码是fork了videojs-resolution-switcher而来,原代码只支持videojs5.x, 所以修改了部分代码使其支持videojs6.x。API部分没有变化,可以参考这里。