vue调取电脑摄像头实现拍照功能_vue.js

本文实例为大家分享了vue调取电脑摄像头实现拍照功能的具体代码，供大家参考，具体内容如下

实现效果图：

拍照前&拍照后（我电脑摄像头挡住的，所以图片是灰色）

1.点击拍照上传功能调取电脑摄像头权限

2.选择允许使用摄像头之后，页面摄像头区域开始显示画面

3.点击拍照按钮，右侧显示拍摄的图片。点击保存即可

完整代码：

我这里写的是一个组件，所以触发调取摄像头事件是从父组件传过来的。也可以直接写一个页面上。