In a single page application, the first visit to the component can be used normally, but the second visit again, this error occurs, options can not be injected into
You probably need to dispose() the player. I think this is Vue but it might be useful to compare the approach taken in the react guide.
videojs() only creates the player once and does not update options when called again with different options. We're in the process of adding a better way of getting a player: https://github.com/videojs/video.js/pull/4836
If you want to reuse the same player, a lot of the options do have setters that you can call once the player has been created -- player.aspectRatio('430:265') for example, unfortunately, setPlaybackRates is missing currently.
However, it's possible that what you want is to actually dispose the player and recreate it each time completely.
Also, there's an issue with an example of using Video.js with Vue in an issue: https://github.com/videojs/video.js/issues/4167#issuecomment-344731747
Thank you very much. According to your guidance, I have now solved this problem @gkatsev @mister-ben
Awesome, glad to hear it.
@davy-gan, Do you mind sharing the solution, I have the same isssu. the video does not show up second time.
How did you solve this problem
var oldPlayer = document.getElementById(video_id);
videojs(oldPlayer).dispose();
If component data, videojs options was changed, dispose() will destroy DOM element, new initialization is not possible.
<video ref="videoPlayer.." is removed with dispose, as result initialize again is not possible.
result in error
video.es.js:178 VIDEOJS: WARN: The element supplied is not included in the DOM
Most helpful comment
If component data, videojs options was changed, dispose() will destroy DOM element, new initialization is not possible.
<video ref="videoPlayer.."is removed with dispose, as result initialize again is not possible.result in error
video.es.js:178 VIDEOJS: WARN: The element supplied is not included in the DOM