HarmonyOS 鸿蒙Next ijkplayer xomponent 切换播放

HarmonyOS 鸿蒙Next ijkplayer xomponent 切换播放
<markdown _ngcontent-aop-c149="" class="markdownPreContainer">

@Prop @Watch(‘updateVideoSource’) videoSource: VideoSource | null = null;

使用第三方库ijkplayer播放rtsp流，这是官方项目的播放例子，目前实现了播放，现在我想要更新播放地址进行切换播放 使用[@Watch](/user/Watch)在更新数据源的时候重新调用play，但是不行，是否是要重新创建Xomponent.

import { PlayerListener } from './PlayerListener'
import { VideoPlayer } from './VideoPlayer'
import { VideoSource } from './VideoSource'
class PlayerListenerClass implements PlayerListener{
onPlay(): void {
}
onStop(): void {
}
onPause(): void {
}
onError(): void {
}
onUpdate(current: number, duration: number): void {
}
onComplete(): void {
}
}
@Component
export struct CommonVideoView {
private videoSource: VideoSource | null = null;
private pic = $r(‘app.media.icon’);
private xComponentContext: object | null = null;
private player: VideoPlayer = new VideoPlayer();
private isInit: boolean = false;
private xComponentId = “xid” + Math.random();
@State isPlaying: boolean = false;
build() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Auto, justifyContent: FlexAlign.Start }) {
Stack() {
XComponent({
id: this.videoSource?.title + this.xComponentId,
type: ‘surface’,
libraryname: ‘ijkplayer_napi’
})
.onLoad((context) => {
if (context) {
this.xComponentContext = context;
}
})
.onDestroy(() => {
      })
      .width(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)
      .height(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)
      .onClick(() =&gt; {
        <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.stop();
      })
    Image(<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.pic)
      .width(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)
      .height(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)
      .visibility(<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.isPlaying ? Visibility.None : Visibility.Visible)
      .onClick(() =&gt; {
        <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.play();
      })
    Image($r(<span class="hljs-string"><span class="hljs-string">'app.media.icon_replay'</span></span>))
      .width(<span class="hljs-number"><span class="hljs-number">45</span></span>).height(<span class="hljs-number"><span class="hljs-number">45</span></span>)
      .visibility(<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.isPlaying ? Visibility.None : Visibility.Visible)
      .onClick(() =&gt; {
        <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.play();
      })
  }.width(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>).height(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)

  Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Start }) {
    Button($r(<span class="hljs-string"><span class="hljs-string">'app.string.Play'</span></span>))
      .onClick(() =&gt; {
        <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.play();
      })
      .width(<span class="hljs-string"><span class="hljs-string">'400px'</span></span>)
      .height(<span class="hljs-string"><span class="hljs-string">'80px'</span></span>)
      .margin(<span class="hljs-string"><span class="hljs-string">'15px'</span></span>)
    Button($r(<span class="hljs-string"><span class="hljs-string">'app.string.Pause'</span></span>))
      .onClick(() =&gt; {
        <span class="hljs-keyword"><span class="hljs-keyword">if</span></span>(<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.player != <span class="hljs-literal"><span class="hljs-literal">null</span></span>) {
          <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.player.pause()
        }
      })
      .width(<span class="hljs-string"><span class="hljs-string">'400px'</span></span>)
      .height(<span class="hljs-string"><span class="hljs-string">'80px'</span></span>)
      .margin(<span class="hljs-string"><span class="hljs-string">'15px'</span></span>)

    Button($r(<span class="hljs-string"><span class="hljs-string">'app.string.destroy'</span></span>))
      .onClick(() =&gt; {
        <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.release();
      })
      .width(<span class="hljs-string"><span class="hljs-string">'400px'</span></span>)
      .height(<span class="hljs-string"><span class="hljs-string">'80px'</span></span>)
      .margin(<span class="hljs-string"><span class="hljs-string">'15px'</span></span>)
  }
}
}
initPlayer(): void {
this.player = new VideoPlayer();
let listener = new PlayerListenerClass();
this.player.setContext(this.xComponentContext!, this.videoSource?.title + this.xComponentId)
.setVideoSource(this.videoSource!)
.setListener(listener);
}
play(): void {
if (!this.isInit || this.player == null) {
this.isInit = true;
this.initPlayer();
}
this.isPlaying = true;
this.player?.play();
}
stop(): void {
if (this.player != null) {
this.player.pause();
}
this.isPlaying = false;
}
release() {
if(this.player != null) {
this.player.stop();
this.player.release();
this.isInit = false;
}
}
}