vue2怎么调用手机摄像头

在 Vue2 中，可以通过调用浏览器提供的媒体设备 API （MediaDevices API）来访问摄像头，从而实现拍照或录制视频的功能。

首先，需要在组件中添加一个用于显示视频流的 video 标签：

<video ref="video" autoplay></video>

然后，在组件的 methods 中调用 getUserMedia 函数获取媒体流并将其绑定到 video 标签上：

methods: {
  startCapture() {
    navigator.mediaDevices.getUserMedia({
      video: { facingMode: "environment" }, // 指定使用后置摄像头
      audio: false // 不使用音频
    })
    .then(stream => {
      this.$refs.video.srcObject = stream; // 绑定媒体流到 video 标签上
      this.$refs.video.play(); // 播放视频流
    })
    .catch(error => {
      console.log(error);
    });
  }
}

其中，facingMode 参数指定使用后置摄像头，audio 参数指定不使用音频。如果需要使用前置摄像头，可以将 facingMode 参数设置为 "user"。

最后，在组件中添加相应的按钮或其他触发事件，调用 startCapture 函数来启动摄像头即可。

需要注意的是，在使用摄像头时，需要在浏览器中允许访问摄像头权限，否则会导致无法获取媒体流。可以使用以下代码来请求用户摄像头权限：

navigator.mediaDevices.getUserMedia({ video: true })
.then(stream => {
  console.log('获取摄像头权限成功！');
})
.catch(error => {
  console.log('获取摄像头权限失败：', error);
});

此外，还可以使用第三方库如 vue-web-cam 等来方便地在 Vue2 中使用摄像头功能。