不推荐使用 VideoJS 播放列表的多个实例答案

【问题标题】：Multiples instances of VideoJS playlist are deprecated不推荐使用 VideoJS 播放列表的多个实例
【发布时间】：2019-05-13 11:26:06
【问题描述】：

我正在开发一个 Wordpress 插件，它允许用户将自定义视频播放列表添加到他们的页面或帖子中，为此我正在使用 Videojs 和 Videojs 播放列表库。

我已经成功地将单个播放列表添加到页面中，但是当创建第二个播放列表时，第一个播放器被禁用。 First Player disabled

我面临的其他问题是，虽然添加了 vjs-playlist div，但它只显示在创建的第一个播放器中。 Code display in the browser

      var options = {"techOrder": ["html5","youtube", "flash"]};
      var myPlayer = videojs('my-playlist-player', {options, "autoplay": false, "controls": true, "fluid": true, "liveui": true});
  
      myPlayer.playlist([{
        name: 'Test item 1 type .m3u8',
        description: 'Testing for videojs-playlist-ui integration',
        duration: '45',
        sources: [
          {src: '//vjs.zencdn.net/v/oceans.mp4',type: 'video/mp4'}
        ],
        thumbnail: [
          {
            srcset: '//bcvid.brightcove.com/players-example-content/clouds-1800.jpg',
            type: 'image/jpeg',
            style: 'max-height: 120px;'
          }  
        ]
        },{
        name: resTitle,
        description: resDesc,
        duration: resDuration,//'45',
        sources: [
          {src: resItemSrc, type: resMime}
        ],
        thumbnail: [
          {
            srcset: resThumbnail,
            type: resImgType,
            style: thumbStyle//'max-height: 120px;'
          }  
        ]
        }
        } 
      ]);

      
      console.log(myPlayer.playlist());
      myPlayer.playlistUi({el: document.getElementById('vjs-playlist'), horizontal: true});
      myPlayer.playlist.autoadvance(1);

我相信我的错误发生是因为 videojs 函数在所有元素中检测到相同的 id，但如果是这样，我该如何避免这种情况？

关于为什么会发生此错误的任何其他想法或意见，都会很棒。

提前致谢。

【问题讨论】：

标签： wordpress video.js playlist brightcove

【解决方案1】：

更多信息，我想检查脚本检测到的玩家数量，因此我在控制台中打印了window.videojs.players，即使创建了更多玩家，也只会检测到一个玩家。 Check result

这可能是因为他们的 ID 相同吗？如果是这样，如何解决？ HTML Result

【讨论】：