APP端使用video组件做观看直播页面

由于查看组件文档上说：App的实时音视频播放，不是使用 live-player，而是直接使用 video 组件。
于是我使用了video标签来做观看直播的组件;
我要问的问题是：在观看直播的过程中，主播断网了，当主播重新联网恢复推流继续直播后，在观看用户这边监听到了并打印log开始观看了，但是在页面上的表现并不是直播的视频画面，而是一直转圈加载中的黑色屏幕。无法继续观看直播。退出直播间，重新再次进入直播间可以观看了，但是这不符合产品设计，也是特别不好的用户体验。请问是不支持吗？或者我哪里使用错误？请帮忙解答一下。
下边是观看直播页面的一些代码：

<video  
        controls="true"  
        :poster="poster"  
        class="myVideo"  
        id="myVideo"  
        :src="src"  
        @play="play"  
        @error="videoErrorCallback"  
        enable-progress-gesture="false"  
        page-gesture="true"  
      ></video>

 export default {  
    onLoad(options) {  
        this.liveId = options.id  
    },  
    onReady() {  
        this.getPlayUrl()  
    },  
    data() {  
        return {  
            src: ''  
        }  
    },  
    methods: {  
        // 获取观看地址  
    async getPlayUrl() {  
      let options = {  
        ID: this.liveId  
      };  
      let result = await appliveInRu(options);  
      if (result.statusCode === 200 && result.errMsg.includes('request:ok')) {  
        let data = result.data;  
        console.log('获取拉流地址', data);  
        let msg = data._MSG_;  
        if (msg === '' || msg.startsWith('OK')) {  
          const _DATA_ = data._DATA_;  
          this.src = _DATA_.UIL;  
        } else {  
          uni.showToast({  
            title: msg,  
            icon: 'none'  
          });  
        }  
      }  
    },  
    play(e) {  
      console.log(e);  
      console.log('开始观看了');  
      // 开始观看  
      // this.getPlayUrl();  
    },  
    videoErrorCallback(e) {  
      console.log(e);  
      uni.showModal({  
        content: e.target.errMsg,  
        showCancel: false  
      });  
    },  
    }  
}