<input 
 ref="inputVideo" 
 type="file" 
 name="video"  
 id="video-input" 
 accept="video/*" 
 capture="camcorder" //只是调起摄像头,不选择文件
 @change="videoChange" 
 @click="starVideotape"
/>

<--video用于播放拍摄后的内容-->
<video id="video" width='300' height="300" controls autoplay></video>

<--button用于点击开始录制视频-->
<button @click="onVideo">点击录制视频</button>
<script>
	export default {
		name: 'skippingRopeIndex',
		data() {
			return {
				time:null,
			}
		},
		methods: {
            //视频录制结束后将视频路径赋值给video标签进行播放
			videoChange() {
				var file = document.getElementById('video-input').files[0];
				var url = URL.createObjectURL(file);
				document.getElementById("video").src = url;
			},
			
            //点击button实现调起录制摄像头
			onVideo(){
				const that = this;
				that.$refs.inputVideo.click();
			}
		}
	}
</script>

Logo

前往低代码交流专区

更多推荐