javascript - Vue.js 视频 this.$refs[something].play() 不起作用

Question

因此，我使用 axios 接收了几个视频网址并将它们添加到视频对象中。Vue 的视频没问题，我可以毫无问题地玩。但是，当我尝试使用 $refs 播放它时，它不起作用......

<template>
    <div v-for="(video, index) in videos" v-bind:key="video">
        <video
            controls
            v-show="videoState[index]"
            :ref="index" :src="video ? video : sampleVideo"
            type='video/mp4'>
        </video>

        <div class="video-btn" v-bind:class="{ flash: buttonFlash }"
                    v-show="videoState[index]"  
                    @click="recordStart(index)">
             <img src="../../assets/microphone.png">
        </div>
    </div>
</template>

export default {
    methods: {
        recordStart(video) {
            this.$refs[video].play();
        },
    },
},

如果需要更多信息，请告诉我。提前致谢。

[已编辑]

我添加了 recordStart(index) 调用。

这是 this.$refs 对象的日志。

[解决了]

将其更改为this.$refs[video][0].play()有效。我的错 ：（。

标签： javascriptvue.js