为 VideoJS 5 编写插件

Question

当我尝试使用最新版本的videojs 5 时，以下代码不再有效。我正在尝试编写一个 videojs 插件，但是 videojs 5 使用 ecmascript 6，这对我来说是新的。任何帮助表示赞赏。

   videojs.SharingButton = videojs.Button.extend({
    /** @constructor */
    init: function(player, options){
        videojs.Button.call(this, player, options);
        this.player = player;
    }
});

videojs.SharingButton.prototype.createEl = function(tagName,options) {
    return videojs.Component.prototype.createEl(tagName,{
        className: this.buildCSSClass(),
        innerHTML: '',
        role: 'button',
        'aria-live': 'polite', // let the screen reader user know that the text of the button may change
        tabIndex: 0
    });
}

videojs.SharingButton.prototype.buttonText = 'Share Video';

videojs.SharingButton.prototype.options_ = {};

videojs.SharingButton.prototype.buildCSSClass = function(){
    return 'vjs-sharing-control ';
};

Answer 1

您好，我遇到了同样的问题，请替换此代码

videojs.SharingButton = videojs.Button.extend({

来自

var SharingButton = videojs.getComponent('Button');
videojs.SharingButton = videojs.extend(SharingButton , {...});
videojs.registerComponent('SharingButton', SharingButton);

var myButton = myPlayer.addChild('SharingButton');

如果您想添加一个不是播放器元素的直接子元素的组件，您将必须爬升子元素并添加该组件。喜欢：

parentComponent = myPlayer.getChild('component1').getChild('component2')...
parentComponent.addChild('SharingButton')

请注意，播放器组件必须以小写字母开头，例如controlBar.

在此link中找到组件树。

随着 5.0 版的构建（见此 link）进行了大量更改，不幸的是大多数 videojs 插件没有更新它们的代码！其中一个主题是社交按钮分享

为 VideoJS 5 编写插件

Write plugin for VideoJS 5

javascript

video.js