页面结构
效果预览
js部分
export default {
data() {
return {
videoWidth: 250,
videoHeight: 350,
imgSrc: "",
thisCancas: null,
thisContext: null,
thisVideo: null,
openVideo:false
};
},
mounted(){
//this.getCompetence()//进入页面就调用摄像头
},
methods: {
// 调用权限(打开摄像头功能)
getCompetence() {
var _this = this;
_this.thisCancas = document.getElementById("canvasCamera");
_this.thisContext = this.thisCancas.getContext("2d");
_this.thisVideo = document.getElementById("videoCamera");