ReactJS中用于Videojs的静态视频URL正在播放，但不是从数据库中动态的

Question

视频链接是类型MP4，当我提到源视频中视频的静态链接时，视频播放非常好，但是当视频链接从数据库中动态获取时，视频不是播放，React引发了这样的错误...

videojs：错误：(代码：4 media_err_src_not_supported(此媒体找不到兼容的来源。

任何人可以帮助我??

componentDidMount = () => {
    this.getvideobyid()
}
async getvideobyid() {
    try{
        const response = await 
        axios.get('http://localhost:8080/get_videos/2');
        this.setState({
        video_url: response.data.video_list[0].url_for_video 
        })
        }
    catch(error){
            console.log('eror while fetching.....', error)
    }
}
render() {
    const videoJsOptions = {
          width: 720,
          height: 300,
          controls: true,
          sources: [{
               src: this.state.video_url,
               type: 'video/mp4',
               },
            ]
      };
    return (
      <div>
          <VideoPlayer 
          {...videoJsOptions}
          />
      </div>
    )
}

export default class VideoPlayer extends React.Component {
    componentDidMount() {
    this.player = videojs(this.videoNode, this.props, function 
    onPlayerReady() {
        console.log('onPlayerReady', this)
    });
  }
componentWillUnmount() {
    if (this.player) {
    this.player.dispose()
}
}
componentWillReceiveProps(newProps) {
    if (this.player) {
    this.player.src({
    type: 'video/mp4',
    src: newProps.video_url
    });
   } 
}
render() {
    console.log('what render is there in node......', this.props)
        return (
            <div>    
                <div data-vjs-player>
                <video ref={ node => this.videoNode = node } 
                className="video-js">      
                </video>
            </div>
            </div>
            )
      }
}

使用代码更新。如您所见，对于一个来源，我给出了静态链接，它正在评论，它正在播放，但是另一个来源是动态来自DB的，我已经设置了状态。它没有玩。我希望链接来自数据库时播放该视频。

Answer 1

我自己解决了通过为ISVIDEO设置boolean false，当ComponentDidMount中调用API时，我将为ISVIDEO

设置为TRUE

this.state= {
isVideo : false,
video_url:''
}