Video 在nuxt js中动态更改视频标记的src

我正在使用nuxt.js。我有一个标记，我想动态更改src，但我不能调用load（）方法来刷新视频并开始播放

标签：

load（）不工作！它有错误。我无法访问load（）方法！为什么？我该怎么办

错误：

cannot read property 'load' of undefined

---

在数据中定义videoUrl：

data() {
 return {
  videoUrl: 'path/to/old/video'
 }
}

html格式的模板：

 <video
  ref="videoPlayer"
  muted
  controls
 >
  <source :src="videoUrl" type="video/mp4" />
 </video>

---

在数据中定义videoUrl以正确激活Vue反应系统非常重要。

我有数据（）我正在使用它，但错误来自load（）方法：无法读取未定义的属性“load”！我已经在我的源代码中实现了上述功能，并且没有错误。：/I从视频标记中删除if及其工作方式：|sh****t:|：v-if=“playing==true”仅在用户单击播放视频时播放！这种情况就是问题所在：|到

data() {
 return {
  videoUrl: 'path/to/old/video'
 }
}

 <video
  ref="videoPlayer"
  muted
  controls
 >
  <source :src="videoUrl" type="video/mp4" />
 </video>

changeVideoUrl() {
 this.videoUrl = '/videos/home/intro-desktop.mp4'
 const videoPlayer = this.$refs.videoPlayer
 videoPlayer.load()
 videoPlayer.play()
},