需求:隐藏视频播放时显示的控件
问题:在video中设置controls属性为false,隐藏控件并没有效果
<video id="video" controls="false" src="https://xxxxvideo.mp4" autoplay muted></video>
![](https://img-blog.csdnimg.cn/img_convert/82f2392c9c8956265e604775937952aa.png)
解决:动态绑定data上的变量
<template>
<video id="video" :controls="vedioControls" src="https://xxxxvideo.mp4" autoplay muted>
</video>
</template>
<script>
export default {
data() {
return {
vedioControls:false
};
},
</script>
![](https://img-blog.csdnimg.cn/img_convert/f9f705baedf20fe1c892773cc422cc84.png)