Question

我正在努力将数据属性添加到为音频js播放器创建的自定义按钮上。这将是文本文件的可折叠可折叠触发器。我认为我必须使用createEl（）函数，但是无法使其与我的实现配合工作。

我正在尝试添加以下属性：

'data-toggle': 'collapse',
'data-target': '#' + audioID,
'aria-expanded': 'false'**strong text**

感谢您的帮助。

let audioBtnComponent = videojs.getComponent('Button')

let audioTextBtn = videojs.extend(audioBtnComponent, {
    constructor: function () {
        audioBtnComponent.apply(this, arguments)
        this.controlText('Toggle text for audio player')
        // this.createEl({}, {}, { 'class': 'Fudge' })
   },
   handleClick: function () {
    accordionElem[i].classList.toggle('audio-text-open')
    audioList[i].closest('.video-js').classList.toggle('audio-text-open')
   },
   buildCSSClass: function () {
       return 'accordion-trigger audio-text-accordion-trigger collapsed'
   },
   //createEl: function (type, properties, attributes) {
     //  return('button', {}, {'data-toggle': 'collapes'})
    //}
})

videojs.registerComponent('audioTextBtn', audioTextBtn)

let audioPlayer = videojs(audioList[i])
audioPlayer.getChild('controlBar').addChild('audioTextBtn', {})

Answer 1

createEl()应该返回一个元素

createEl: function () {
  return audioBtnComponent.prototype.createEl.call(this, 'button', {}, {'data-toggle': 'collapes'});
}

如何使用自定义videojs按钮添加属性

1 个答案: