当使用VideoJS的视频工作正常，但它没有显示我的可用来源的选项，因为它应该.
我尝试使用插件的来源，它仍然不显示，Idk是什么或为什么它这样做，也许我用错了方式，也许源代码是默认自动隐藏或它只是窃听.有人知道如何修复它吗？
我的代码备注：源来自另一个组件，并且已经过测试，使用时应能正常工作。

import React from 'react';

import videojs from 'video.js';
import 'video.js/dist/video-js.css';

import "videojs-hotkeys";

export const VideoJS = (props) => {
  const videoRef = React.useRef(null);
  const playerRef = React.useRef(null);
  const {options, onReady} = props;
  React.useEffect(() => {

    // Make sure Video.js player is only initialized once
    if (!playerRef.current) {
      // The Video.js player needs to be _inside_ the component el for React 18 Strict Mode. 
      const videoElement = document.createElement("video-js");

      videoElement.classList.add('vjs-big-play-centered');
      videoRef.current.appendChild(videoElement);

      const player = playerRef.current = videojs(videoElement, options, () => {
        videojs.log('player is ready');
        onReady && onReady(player);
      });
    // You could update an existing player in the `else` block here
    // on prop change, for example:
    } else {
      const player = playerRef.current;

      player.autoplay(options.autoplay);
      player.src(options.sources);
    }
  }, [onReady, options, videoRef]);

  // Dispose the Video.js player when the functional component unmounts
  React.useEffect(() => {
    const player = playerRef.current;

    return () => {
      if (player && !player.isDisposed()) {
        player.dispose();
        playerRef.current = null;
      }
    };
  }, [playerRef]);

  return (
    <div className='w-100 h-100' data-vjs-player >
      <div ref={videoRef}  className='w-100 h-100' />
    </div>
  );
}
export default function Videojs({sources}){

// Video Options
  const videoJsOptions = {
    responsive: true,
    controls: true,
    playbackRates: [0.5, 1, 1.5, 2],
    preload: 'auto',
    plugins: {
        hotkeys: {
        volumeStep: 0.1,
        seekStep: 5,
        enableModifiersForNumbers: false
        }
    },
    sources: sources.map(item => {
      return {
        src: item.url,
        type: item.isM3U8 && 'application/x-mpegURL',
        quality: item.quality
      }
    })
  }
  
  return(
    <div className='h-100 w-100'>
      <VideoJS options={videoJsOptions} />
    </div>
  )
}