javascript - 带有 vue 的 HTML 5 视频和 src 值

Question

我的页面中有一个 HTML 5 视频，我想动态设置 src。我正在使用 vue，在我的 js Controller 中我设置了一个带有视频路径的变量，然后我在我的页面中使用该变量，如下所示:

<video width="450" controls>
    <source v-model="controller.var" v-bind:src="var" type="video/mp4">
</video>

播放器未加载视频，但我的 var 已使用正确的 url 正确设置。我在这里缺少什么？

谢谢

Answer 1

添加 key video 元素的源 URL 属性将导致视频和源在 URL 更改时更新:

<video
  :key="video"
  width="450"
  controls
>
  <source
    :src="video"
    type="video/mp4"
  >
</video>

这支持动态替换视频+源。