首页 > 解决方案 > 如何从 v-for 循环元素中获取 src

问题描述

我正在循环一个元素:

<li v-for="file in lesson.files">
  <a @click="sourceReplace()" class="copied" :id="file.file_id" :src=file.src>
     {{file.name}}  
  </a>
</li>

单击此元素时,我需要将单击的元素的 src 返回到称为链接的变量

methods: {
  sourceReplace(){
    var currentVideo = document.getElementById('current-video');
    var currentSource = document.getElementById('current-source');
    var link = this.src;
    currentSource.setAttribute('src', link);
    currentVideo.setAttribute('src', link);
    alert(link)
    currentVideo.load();
    currentVideo.play();
  }
},

链接返回未定义

标签: javascriptvue.jsvue-componentdom-events

解决方案


不知道你为什么这样做,怎么样

<li v-for="file in lesson.files">
  <a @click="sourceReplace(file.src)" class="copied" :id="file.file_id">
     {{file.name}}  
  </a>
</li>

接着

methods: {
  sourceReplace(src){
    var currentVideo = document.getElementById('current-video');
    var currentSource = document.getElementById('current-source');
    var link = src;
    currentSource.setAttribute('src', link);
    currentVideo.setAttribute('src', link);
    alert(link)
    currentVideo.load();
    currentVideo.play();
  }
},

推荐阅读